Передача и присвоение данных состоянию с помощью Composition API в Vue - PullRequest
Новая
       55

Передача и присвоение данных состоянию с помощью Composition API в Vue

0 голосов
/ 26 мая 2020

Я новичок в веб-программировании и пытаюсь создать простую динамику c веб, используя Vue. У меня небольшая проблема с передачей и присвоением данных состоянию с помощью 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,
   };
});

Мне нужно передать данные и назначить эти данные который я получаю из API в Main. vue, чтобы указать в Child. vue. Несколько дней go Я не пробовал использовать API композиции, и мне удалось успешно передать данные между родительским элементом в дочерний или дочерний элемент в родительский, но я запутался с API композиции. Я прочитал документацию по API композиции, но не нашел ответа.

...