将模板v-for转换为computed

Question

我正在与BootstrapVue合作。

我正在循环一个数组，检查我的数组(indexArray)的索引与我的组件(indexChild)的索引，然后它应该写我的indexArray在我的b-form-inputv-model的值。

如何将此代码转换为计算函数?我知道我必须过滤它，但我不知道如何解决这个问题。

<div v-for="(ID, indexChild) in 3" :key="indexChild">
<div v-for="(item, indexArray) in Array" :key="indexArray">
<div v-if="indexArray == indexChild">
<b-form-input type="number" :v-model="item"></b-form-input> 
</div>
</div>
</div>

my Arrayconsole.log:

(3) ['1234', '4321', '1379']
▼
0: "1234"
1: "4321"
2: "1379"

Answer 1

只需返回数组中已知的索引项，无需迭代:

computed: {
itemOfInterest(){
return this.yourArray[this.indexChild]
}
}

解决原始帖子中的更新。你仍然可以在你的模板

中这样做。

<template>
<div v-for="(ID, indexChild) in 3" :key="indexChild">
<b-form-input type="number" :v-model="Array[indexChild]"></b-form-input>
</div>
</template>