vue3 props传递值为ref([]) 并且使用

在 Vue 3 中，可以使用 `props` 选项来传递属性。如果要传递一个 `ref` 类型的属性，可以使用 `type` 选项设置为 `Object` 类型，并指定该对象包含一个 `value` 属性。例如：

props: {
  list: {
    type: Object,
    default: () => ({ value: [] })
  }
}

在父组件中，可以通过创建一个 `ref` 对象并将其传递给子组件的 `list` 属性来使用：

<template>
  <div>
    <ChildComponent :list="listRef" />
  </div>
</template>

<script>
import { ref } from 'vue';
import ChildComponent from './ChildComponent.vue';

export default {
  components: {
    ChildComponent
  },
  setup() {
    const listRef = ref([]);

    return {
      listRef
    }
  }
}
</script>

在子组件中，可以使用 `props.list.value` 来访问传递的数组。例如：

<template>
  <ul>
    <li v-for="item in list" :key="item">{{ item }}</li>
  </ul>
</template>

<script>
export default {
  props: {
    list: {
      type: Object,
      default: () => ({ value: [] })
    }
  }
}
</script>