Передача новых итеративных данных в реквизит Vue. js - PullRequest
Новая
       60

Передача новых итеративных данных в реквизит Vue. js

0 голосов
/ 20 марта 2020

У меня есть один vue компонент, в который я извлекаю данные и хочу передать с подпорками данные повторного результата. Но на компоненте newModal я получил реквизит пустой объект. Как я могу передать свой повторный результат в объект результата? 

    <template>
      <div>
            <div
              v-for=" result  in users"
              :key="result.id">
              <div>
                  {{ `${result.user.first_name} ${result.user.last_name}` }}
            </div>
            </div>
            <new-modal v-bind:result="result"/>
      </div>
    </template>

    <script>
    import { mapActions } from 'vuex';
    import newModal from './newModal.vue';

    export default {
      components: { newModal },
      data() {
        return {
          users: [],
          result: {},
        };
      },
      async mounted() {
        const { results } = await this.fetchAllUsers();
        this.users = results;
      },

      methods: {
        ...mapActions({
          fetchAllUsers: 'user/fetchAllUsers',
        }),
      },
    };
    </script>

1 Ответ

0 голосов
/ 20 марта 2020

Область действия переменной: result ограничено l oop, result не будет доступно за пределами l oop, вместо этого будет выброшено reference error, поэтому перемещено new-modal внутри l oop, это также позволит отображать компонент для каждой итерации 

<div
  v-for="result  in users"
  :key="result.id"
>
  <div>
   {{ `${result.user.first_name} ${result.user.last_name}` }}
  </div>

  <!-- Here -->
  <new-modal v-bind:result="result"/> 
</div>
...