メソッドから計算されたプロパティを取得するにはどうすればよいですか？

Question

まず、Vueで無限に読み込むために、thisモジュールを使用しています。

私はAPIサーバーのjsonデータをのデータオブジェクトに入れて、配列を4のサイズのグループに分割した後、再び変数に配列を保存します。それは、コンピュータプロパティから変数を取得できないメソッドイベントハンドラを使用して要素を追加することです。私はVueには新しく、これについての情報は見つかりませんでした。ここにコードがあります！

export default { 
    name: 'main', 

    data:() => ({ 
    items: [], 
    line: [] 
    }), 

    async created() { 
    this.items = await fetch('/videos').then(res => res.json()) 
    }, 

    computed: { 
     columns: function() { 
      return chunk(this.items, 4) 
     } 
    }, 

    methods: { 
    onInfinite() { 
     setTimeout(() => { 
     const temp = [] 
     const len = this.columns.length 
     for (let i = len + 1; i <= len + 5; i++) { 
      temp.push(this.columns[i]) 
      console.log(this.columns[i]) //It prints 'undefined' 
     } 

     this.list = this.list.concat(temp) 
     this.$refs.myRefName.$emit('$InfiniteLoading:loaded') 

     }, 700) 
    }, 
    }, 
    components: { 
    InfiniteLoading 
    } 
} 

Answer 1

const len = this.columns.length // length of `columns` array 

次の行：

for (let i = len + 1; i <= len + 5; i++) { 
    ...this.columns[i] 

あなたは値が明らかに定義されていない配列の長さは上記のインデックスにアクセスしようとしています。

は、おそらくこのようなcolumnsを通してだけループする必要がありますあなたのcolumnsはそれぞれに4つの要素を持つ「チャンク」配列の配列がある場合

for (let column of columns) { 
    for (let item of column) { // asuming column is Array(4) 
     console.log(item) 

はそれが動作するはずです。