我有一個<p v-for="index in attrLength" :key="index" ></p>. 這個想法是獲取一個物件，在這種情況下，const project = projects[index]將它放在<p>標簽中，添加一個.到它，然后index從回圈中添加數字，但在它前面注入字母“p”，所以你會結束在雙花括號內加上project.p1，依此類推，如下所示： .project.p2<p v-for="index in attrLength" :key="index" >{{project.p1}}</p>
我怎么做？我在檔案中沒有找到任何東西。這甚至可能嗎？
uj5u.com熱心網友回復：
您可以將括號表示法與計算物件鍵一起使用：
<p v-for="index in attrLength" :key="index" class="text-3xl">
{{ project[`p${index}`] }}
</p>
演示
uj5u.com熱心網友回復：
我假設attrLength是一個數字。因此，因為迭代總是從1內部v-for回圈開始。您可以使用projects[index - 1]而不是訪問專案物件projects[index]。
現場演示：
new Vue({
el: '#app',
data: {
projects: [{
p1: 'Paragraph 1'
}, {
p2: 'Paragraph 2'
}]
}
})<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
<div id="app">
<p v-for="index in 2" :key="index" class="text-3xl">
{{ projects[index - 1][`p${index}`] }}
</p>
</div>轉載請註明出處，本文鏈接：https://www.uj5u.com/qukuanlian/493881.html
標籤：Vue.js