一、模块语句

1、v-html="mess(名字随意)"

                 如：mess:'<h1>这是一个h1标签</h1>'

2、v-bind:class="{ 样式名:true/false }"

      如：样式必须为类class，ID则不可以

             .class1{ color:red; }

3、v-if:="自定义名称"

      如：seen：true

           判断是true/false 若true就显示，false就隐藏

4、v-bind:href="地址名称"

      如：url:"www.baidu.com" 可跳转到相应的页面

5、v-on:click="方法名"

      如：点击事件的方法名称

6、v-model:="名称(mess)"

     如：mess:'hello vue.js'   双向绑定事件

7、@click="点击事件的方法"

      如：字符串翻转事件

            reverseMessage(){ this.mess=this.mess.split('').reverse().join('') }

            以空格为分界线进行文字的翻转，在把翻转过的文字添加进去即可

8、过滤器(filters)

            如：过滤器接受表达式的值作为第一个参数

           即过滤器就是一个方法，会执行此方法

9、动态添加代码样式

         使用三元表达式进行判断

         如：:calss=" { index==0 ? style1 : style2 } "

         如果点击的下标为0 就显示style1的样式，否则就是style2的样式

二、条件语句

1、v-if:判断表达式的值是true/false，判断是否执行此语句(v-if只是隐藏dom节点)

2、v-else：需要和v-if连用

      如：相当于if-else的判断

3、v-else-if:相当于普通else if的应用，判断条件是否允许是否执行

4、v-show:是否显示，看值是true/false (频繁切换时使用，v-show它会删除dom节点)

5、v-if、 v-else、 v-else-if 的判断使用

      ①：若三者合在一起使用

             若不满足v-if的条件，就去执行v-else-if中的条件，

             若v-else-if的条件不满足，就去执行v-else的条件

       ②：若v-if与v-else连用

              此判断就相当于if-else的条件，不满足if就去执行else的条件

三、循环语句      v-for

四、路由（router-link router-view）

            ①：router-link：是一个组件，用于设置一个导航链接，切换不同的页面内容，to的属性为目标地址，即是要显示的页面

            ②：router-view：路由匹配的组件(即是router-link中to的属性值)将在这里渲染

            ③：需要在index.js下配置路径，引入要显示的页面，在routers路由中同页面代码配置相对应的地址，要是页面中的子路由配置路径时需要用children来配置

            ④：还可以通过点击事件进行路由的跳转，this.$router.push({ path:'路径',name:'要跳转的路径页面' });

 

简易： 

  1、v-model:双向绑定

  2、v-for:循环(对数组的循环)

  3、v-show:显示或隐藏(true:显示，false:隐藏)

  4、v-if:显示隐藏(true:删除dom节点，false:不删除dom节点)

  5、v-else-if:必须与v-if连用

  6、v-else:必须和v-if连用 不能单独使用 否则报错 模板编译错误

  7、v-bind:动态绑定(及时对页面的数据进行更改)

  8、v-on:绑定事件(函数必须写在methods里面)

        @click:快捷方法

  9、v-text:解析文本

  10、v-html:解析HTML标签

  11、v-bind:class 三种绑定方法

          ①：对象性 { red:isred }

          ②：三目型 { isred?red:isred }

          ③：数组型 [ { red:isred },{ blue:isblue } ]

  12、v-once:进入页面 只渲染一次 不在进行渲染

  13、v-clock:防止闪烁

  14、v-pre:把标签内部的元素原位输出