1.vue基础

vue遵循MVVM模式,编码简洁, 体积小, 运行效率高, 移动/PC端开发,借鉴angular的模板和数据绑定技术,借鉴react的组件化和虚拟DOM技术。
vue包含一系列的扩展插件(库):
* vue-cli: vue脚手架
* vue-resource(axios): ajax请求
* vue-router: 路由
* vuex: 状态管理
* vue-lazyload: 图片懒加载
* vue-scroller: 页面滑动相关
* mint-ui: 基于vue的组件库(移动端)
* element-ui: 基于vue的组件库(PC端)
简单的引入使用vue方法

{{ message }}
这里是文本插值,用声明的变量代替即可 var vm = new Vue({ //new一个实例 el: '#app', //挂载位置 data: { message: 'Hello Vue!' } })

还有v-text和v-html


//这里会把ht声明的html代码块渲染出来,里面不能再加别的了。
你好
//把声明的name内容渲染到第一个span里面,同样里面不能再加别的。

v-bind

用于给元素绑定属性,v-bind:属性名="表达式"

看title

{{name}}

{{name}}

{{name}}

属性名可以是声明的变量,可以是表达式 后面的表达式可以是声明的变量,也可以是表达式

v-on

用于绑定事件方法
v-on:事件名=“函数方法表达式”


methods:{
       change(){   console.log("gaibianle");  }
        }

{{fn()}}

//页面加载即执行,会打印123 fn(){ console.log(123); } //methods里面定义的方法 方法中的this都指向实例vm //简写模式,v-on:简写为@

v-model双向数据绑定


{{name}}

//懒惰模式

数据双向绑定,可以使用在