1.v-bind 绑定   语法糖是 :冒号

常用于绑定一些 标签属性 等

<img :src="imgUrl">    //   <img v-bind:src="imgUrl">

注意加冒号 里面解析的是js语法 不加 解析的是  字符串 如果想要解析成数字 最好还是加冒号

2.v-if    //   v-show

都可以用于 元素的显示和隐藏

v-if  是利用元素的创建和删除 导致 元素隐藏的

v-show  是利用 display:none//block   使元素显示隐藏   面试经常问道

3.v-model   表单元素双向绑定

<input type="text" v-model="username">

4.v-html  /   v-text

v-text  只能解析里面文本 

v-html  能解析 里面的 html代码片段

5. v-if   // v-else

用来控制元素 显示  v-if  显示的话   v-else  就不显示  反之亦然

6.v-once

元素 只渲染一次

7.v-for  遍历对象或者数组 很常用

<ul>   

    <li  v-for="item in listItem" :key="item.id">{{item.name}} </li>

<ul>

8. v-cloak   隐身衣

ajax请求数据的数据  前台还没有数据 不能让用户看到空白的页面

[v-cloak]{

    display:none;   // 在数据回来渲染完成之后 自动去掉这个属性

}

<div id="app" v-cloak> </app>

7.v-on 事件绑定   语法糖   @ 

给元素绑定事件

<button @click="click">点击</button>

事件修饰符

.stop 阻止事件继续传播

.prevent 阻止元素默认行为

.capture 使用事件捕获模式,即元素自身触发的事件先在此处处理，然后才交由内部元素进行处理

.self 只当在 event.target 是当前元素自身时触发处理函数

.once 事件将只会触发一次

.passive 告诉浏览器你不想阻止事件的默认行为

如果是封装的一个组件 想要触发原生的点击方法 则是 

@click.native=""  这样绑定在组件上面

好了 暂时到此结束了