Vue.js是什么?
Vue(法语) 同view(英语)
Vue.js是一套构建用户界面(view)的MVVM框架.
1.1 Vue.js的目的
Vue的产生核心是为了解决如下三个问题
1.解决数据绑定的问题;
2.Vue.js框架生产的主要目的是为了开发大兴单页面应用 angular.js中对PC端支持的比较良好,但是对移动端支持就一般了.二Vue.js主要支持移动端,也支持PC端.
3.它还支持组件化.也就是可以将页面封装成若干个组件,采用积木式编程,这样是页面的复用度达到最高(支持组件化).
1.2 Vue.js特性
1.MVVM模式
M: model 业务模型,用处:处理数据,提供数据
V: view 用户界面 ,用户视图
业务模型model中的数据发生改变的时候,用户视图view也随之变化.用户视图vie改变的时候,业务模型model中的数据也发生改变.
2.组件化
3.指令系统
4.Vue.js2.0开始支持虚拟DOM.
虚拟DOM可以提升页面的刷新新速度
Vue.js入门
使用Vue.js步骤:
第一步:在页面中引入Vue.js
第二步:Vue.js提供了一个Vue.js,我们需要创建一个对象
new Vue({ });
第三步:在用户界面view中,通过{{}}形式将data中的数据显示在页面中.
在用户界面中,{{}}代码中绑定的data的key,而在页面中显示的是该key的value.
Vue.js对获取的data与页面上显示的{{}}会产生一种映射关系.
app这个变量会代理vue中data数据.所以我们访问data中的数据的时候,直接用app.name就可以了
![]()
这样,如果我们要实现前后台的交互,只要将从后台得到的数据,放在data中,页面就会自动绑定,就这样实现了从model—>view的数据流向.
Vue.js指令
指令,其实指的就是vue自定义的v-开头的自定义属性.每个不同的属性都有不同的意义和功能.
指令的语法:
v-指令名称=”表达式判断或者是业务模型中属性名或者是事件名”
v-text:
作用:操作元素中的纯文本
快捷方式:{{}}