【Vue2.0】—Vue中的key有什么作用？（四）
<div id="root">
<!-- 遍歷陣列 -->
<ul>
<button @click.once="add">添加一個老劉</button>
<li v-for="(p,index) in persons" :key="p.id">{{p.name}}--{{p.age}}
<input type="text">
</li>
</ul>
</div>
<script>
Vue.config.productionTip = false;
new Vue({
el: '#root',
data: {
persons: [{
id: '001',
name: '張三',
age: 18
}, {
id: '002',
name: '李四',
age: 19
}, {
id: '003',
name: '劉宇',
age: 20
}],
car: {
name: '奔馳',
price: 10000,
color: 'blue'
},
str: 'abcd'
},
methods: {
add() {
const p = {
id: '004',
name: '老劉',
age: 21
}
this.persons.unshift(p)
}
}
})
</script>
轉載請註明出處，本文鏈接：https://www.uj5u.com/qianduan/355343.html
標籤：其他
上一篇：添加華為套件時出現“Couldnotfindcom.huawei.hms:location:6.0.0.302”錯誤
下一篇：vue中必須注意點有哪些？