老實說key值不能重復,為什么我測試的時候沒有出問題?
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript" src="js/Vue.js" ></script>
</head>
<body>
<div id="div1">
<div v-show="show">
<div>Hello World</div>
</div>
<input type="button" value="toggle" @click="fn"/>
<ul>
<li v-for="item in list" v-bind:key="item">{{item}}</li>
</ul>
</div>
<script type="text/javascript">
new Vue({
el: "#div1",
data: {
show: true,
list: [1,2,2,4,2,1]
},
methods: {
fn: function(){
this.show = !this.show
}
}
})
</script>
</body>
</html>
2019-04-11
v-for中的key
使用
v-for
更新已渲染的元素列表時,默認用就地復用
策略;列表數據修改的時候,他會根據key值去判斷某個值是否修改,如果修改,則重新渲染這一項,否則復用之前的元素;我們在使用的使用經常會使用
index
(即數組的下標)來作為key
,但其實這是不推薦的一種使用方法;2018-12-29
我的key值有幾個是重復的,也沒出錯呀?