Бесконечный l oop предупреждение в vue отрисовке таблицы - PullRequest
Новая
       22

Бесконечный l oop предупреждение в vue отрисовке таблицы

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

Я попытался вызвать функцию во время рендеринга таблицы и на основе условия в функции я присвоил это значение и отобразил его с помощью интерполяции строк, но я получаю бесконечную ошибку l oop.

Ниже приведено URL для кода

jsfiddle.net / amit_bhadale / 5kct0au1 / 2 /

Ниже приведена функция 

checkData(day, time){
        let that = this
        let result = this.serverData.some(a=>{
            if(a.Day === day && a.Time === time){
                that.cellId = a.id 
                // This is giving infinite loop error

                // if i chnage it to this then it works
                // that.cellId = 'Some normal string'
            }
            return (a.Day === day && a.Time === time)
        })
        return result
    }

HTML часть 

<table>
        <tr v-for="(time, i) in time" :key="i">
            <td v-for="(day, j) in day" :key="j">
                <span v-if="checkData(day, time)">

                </span>
                <span v-else>
                    No data in this cell
                </span>
            </td>
        </tr>
    </table>

1 Ответ

1 голос
/ 26 мая 2020

Не обновляйте реквизиты несколько раз с разными значениями в цикле рендеринга. Чтобы разделить их, вы можете просто поместить его в один компонент: например: 

{
  props: ['time', 'day', 'serverData'],
  computed: {
    cellValue(){
      let val = "No data in this cell"
      this.serverData.some(a=>{
        if(a.Day === this.day && a.Time === this.time){
            val = a.id;return true;
        }
      })
      return val
     }
  }
}

<template>
  <span>cellValue</span>
</template>
...