Бесконечный цикл с v-for внутри v-for - PullRequest
Новая
       7

Бесконечный цикл с v-for внутри v-for

0 голосов
/ 13 сентября 2018

Может ли кто-нибудь помочь мне узнать, как я могу создать цикл внутри цикла, чтобы распечатать отчет о ежегодном отпуске людей и людей.

В основном у меня есть это: 

<div v-for="user_list in user_list_filtered()">
  <div class="user_heading"><h2>{{ user_list.first_name }}</h2></div>
  <div class="report_content" v-for="user_leave in user_leave_filtered(user_list['.key'])">
    <div class="first_date_content">
        {{ user_leave.start_time | formatDate }}
    </div>
    <div class="days_taken_content">
        {{ checkLSL(user_leave.hours, user_leave.type, false) }}
    </div>
  </div>
  <div class="leave_content">
    <div class="total_leave_title">
        Total Leave Taken
    </div>
    <div class="total_hours">
        {{ getTotalLeave() }}
    </div>
  </div>
</div>

Таким образом, он выполняет итерацию по базе данных Firebase и получает всех пользователей, затем последовательно просматривает каждого пользователя и, используя [.key], обнаруживает, что пользователи покидают его, и просматривает все данные об отпуске во время вывода. Затем перейдите к следующему пользователю и там оставьте.

Пока это работает, оно будет продолжать бесконечно зацикливаться и сообщать в моей консоли. 

vue.esm.js?efeb:591 [Vue warn]: You may have an infinite update loop in a component render function.

Может кто-нибудь объяснить, может быть, лучший способ сделать это без бесконечного цикла или решения, чтобы избежать его постоянного цикла?

Спасибо

EDIT

Функции фильтра 

user_leave_filtered(userPassed) {
var self = this
return this.userLeave.filter(function(i) {
    if (i.users_id === userPassed &&
        ((i.start_time >= self.getUnix(self.firstDate) && i.start_time <= self.getUnix(self.lastDate)) ||
        (self.firstDate === null || self.firstDate === '' || self.lastDate === null || self.lastDate === ''))) {
        return true
    } else {
        return false
    }
})
},
user_list_filtered() {
var self = this

return this.userList.filter(function(i) {

    var passed = false

    if (self.userToShow === i['.key'] || self.userToShow === 'All') {
        // Track whether to filter out this leave or not
        self.userLeave.forEach(function(element) {
            if (element.users_id === i['.key']) {
                passed = true
            }
        })
    }

    return passed
})
},

enter image description here

1 Ответ

0 голосов
/ 21 сентября 2018

Причиной была функция (checkLSL ()), которую я использовал для вычисления некоторых итогов через циклы. У меня есть некоторая информация о том, как исправить и, кажется, работает нормально. Спасибо

...