vue todolist 1.0

 1 <template>
 2
 3
 4   <div id="app">
 5
 6       <input type="text" v-model=‘todo‘ />
 7
 8       <button @click="doAdd()">+增加</button>
 9
10       <br>
11
12       <hr>
13
14       <br>
15
16       <ul>
17
18         <li v-for="(item,key) in list">
19
20           {{item}}   ----  <button @click="removeData(key)">删除</button>
21         </li>
22       </ul>
23
24
25   </div>
26 </template>
27
28 <script>
29
30     export default {
31       data () {
32         return {
33           todo:‘‘ ,
34           list:[]
35         }
36       },
37       methods:{
38
39         doAdd(){
40             //1、获取文本框输入的值   2、把文本框的值push到list里面
41
42             this.list.push(this.todo);
43
44             this.todo=‘‘;
45         },
46         removeData(key){
47
48             // alert(key)
49
50             //splice  js操作数组的方法
51
52             this.list.splice(key,1);
53         }
54       }
55
56     }
57 </script>
58
59
60 <style lang="scss">
61
62
63
64 </style>

原文地址：https://www.cnblogs.com/Spinoza/p/10008840.html