<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<div id="test">
<input type="text" v-model="content" @keyup.enter="addTo">
<ul>
<li v-for="(item,key) in tos">
<span>{{item.text}}</span>
<button v-on:click="delTo(key)">delete tos</button>
</li>
</ul>
</div>
</body>
</html>
<script src="../vue.min.js"></script>
<script>
new Vue({
el: '#test',
data: {
index:'',
content: '',
tos:[
{text:'this is a dog'}
]
},
methods: {
addTo: function() {
var text = this.content
// alert(text)
if (text) {
this.tos.push({text:text})
this.content=''
}
},
delTo: function(index) {
// alert(index)
this.tos.splice(index,1)
}
}
})
</script>
开始看视频学习1.0，网上查删除传值都是delTo($index),用vue.min.js时，一直报错未定义，在js data定义后，所删除行错误，查了一下资料，没找到为什么，
然后自己研究了一下，没按套路进行，结果好使了
添加是点击enter，进行添加展示到列表中，删除通过循环得到的key，传值到js中，进行id删除
521
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
