vue.js 语法 双向的页面绑定：数据变化页面变化和前端数据集变化是一样的 小实例
<!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="handleBtnClick">提交</button> <ul> <li v-for="item in list">{{item}}</li> </ul> </div> <script> var app=new Vue({ el:"#app", data:{ list:['第一课的内容','第二课的内容'], inputValue:'' }, methods:{ handleBtnClick:function () { this.list.push(this.inputValue) alert(this.inputValue); } } }) </script> </body> </html>原始的前端MVP模型 model数据层 present展示层 view视图层
mvvm模型只需要关注model层和view视图层就可以了，把vm交给vue.js去做
前端组件化：把每个部分都分开来做，合理拆分大项目，组件化开发，代码在后续的维护上大大的提高
Vue.component("TodoItem",{ props:['content'], template:"<li>{{content}}</li>" })首先创建了一个组件叫做TodoItem,内容是li标签中有todo-item
