解析Vue.js是什么?

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:

作用:操作元素中的纯文本
快捷方式:{{}}