Question

我是Web编程的新手，我尝试使用Vue创建简单的动态Web。我在使用合成API传递数据并将数据分配给状态时遇到了一些问题。这是代码段：

Main.vue：

export default defineComponent({
    setup(_, { root: { $api } }) {

    const state = reactive({
      isFetching: true,
      build: [],
      data:{},
      searches: {
         name: [],
         age: []
      },
    });

onMounted(async () => {
  // get data from API
  state.data = dataFromAPI;   
});

const onSearch = (state2) => {
    ....
};

return {
  ...toRefs(state),
  tableHeaders,
  onSearch,
  pagination: {
    rowsPerPage: 10,
  },
};

Child.vue：

export default defineComponent({
    props: {
        searches: { type: Object, required: true },
    },
    setup(_, { emit }) {
        const state = reactive({
           name: ref(null), // I need assign this with value that I get from API in Main.vue
           age: ref(null),
        });

   const onSearch = () => {
       emit('onSearch', { ...state });
   };

   return {
      ...toRefs(state),
      onSearch,
   };
});

我需要传递数据并将从Main.vue中的API获得的数据分配给Child.vue中的状态。几天前，我没有尝试使用Composition API，但我成功地在父子之间或子子之间传递数据，但是我对composition API感到困惑。我阅读了成分API文档，但找不到任何答案。

在Vue中使用Composition API将数据传递并分配给状态

0 个答案: