1 <!DOCTYPE HTML> 2 <html lang="zh"> 3 <head> 4 <meta charset="utf-8" /> 5 <title>Vue</title> 6 <script src="../../vue.js"></script> 7 </head> 8 <body> 9 <!-- --------------------------------------Mr丶L----------------------------------------------- --> 10 <!-- todoList 简 单 实 现--> 11 <div id="root"> 12 <div> 13 <input v-model="inputValue" /> 14 <button @click="add">提交</button> 15 <ul> 16 <li v-for="(item,index) of list" :key="index">{{item}}</li> 17 </ul> 18 </div> 19 </div> 20 <!-- --------------------------------------Mr丶L----------------------------------------------- --> 21 <script> 22 new Vue({ 23 el:"#root", 24 data:{ 25 inputValue:'hello', 26 list:[] 27 }, 28 methods:{ 29 add:function () { 30 this.list.push(this.inputValue) //添加 31 this.inputValue='' //置空 32 } 33 } 34 35 }) 36 </script> 37 38 </body> 39 </html>