通过Vue实现数据的双向绑定
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>TodoList</title> <script src="./vue.js"></script> </head> <body> <div id="app"> <input type="text" v-model="inputValue" /> <button v-on:click="handelBtnClick">提交</button> <ul> <li v-for="item in list">{{item}}</li> </ul> </div> <script> var app = new Vue({ el: '#app', data:{ list: [], inputValue: '' }, methods:{ handelBtnClick: function(){ this.list.push(this.inputValue) this.inputValue='' } } }) </script> </body> </html>具体效果如下：
