VUE

1、Vue是什么?

Vue是一个渐进式的javascript开发框架，通过组件的开发，最后进行组件的组合，合并组件形成页面

构造器(构造函数)

自动化构建工具

优点

1.组件化开发

2.单页面路由

3.丰富的Api方法

4.双向的数据绑定

5.单向数据流

6.易于结合其他第三库

缺点

1.生态系统不够完善

2.可扩展性稍差

vue的使用:

1>. 引入

2>.构造Vue对象

3>. 使用{{}}将数据和DOM绑定

4>.改变数据即可查看效果

4、vue对象介绍：

  el：vue的作用域，即只有在这个作用域里面的dom收vue控制

  data：vue页面的数据模型，该数据模型为一个javascript对象，且在运行过程中该对象的属性不允许增加，因此页面数据模型必须提前定义好。

methods：事件处理方法对象

6、数据绑定

1>绑定指令： v-bind  {{}}

    v-html:以原始数据方式绑定

2>绑定位置：

  文本，文本可以出现的地方。

    属性，dom对象的属性，如title,src等。

    css，包括style和class绑定

7、vue常用指令。

    1>条件指令

                      v-if

                     

显示

                      v-else-if

                      v-else

  2>v-show

  3>循环指令

                      v-for

                     

                     

                     

4>表单绑定

                      v-model

                     

8、Vue样式操作

1>Class属性绑定

      行内对象绑定: {‘label labelsuccess’:

active}

      预定义对象绑定: classobj:{'label label-success':true}

      数组绑定:v-bind:class=‘[active,danger]’

2>style属性绑定

      行内对象绑定: {‘color’:activecolor}

      预定义对象绑定: styleobj:{‘color‘:’red’}

      数组绑定:v-bind:style=‘[astyle,bstyle]’

9、Vue初始化方法

        Mounted

        在vue初始化完成后调用该方法,一般用于vue初始化完成后需要自动执行的代码

10、Vue中的过滤器

        filters

      在vue初始化完成后调用该方法,一般用于vue初始化完成后需要自动执行的代码

11、vue自定义组件

        什么是组件

        组件可以理解为页面中的完成某个特定功能的模块

          为什么要使用组件

          代码复用，DRY（Don't Repeat Yourself）原则

          Vue.component('组件名',{props:['属性名'],template:'模板内容'})

    自定义组件使用

          <组件名>

          自定义属性绑定

          v-bind:属性名='实际对象'