Vue生命周期以及v-band和v-on的区别

Vue中的v-bind（即简写为 : ）和 v-on（即简写为@）的区别

1 // 完整语法
2 <a v-bind:href="url"></a>
3 // 简写
4 <a :href="url"></a>
5 
6 // 完整语法
7 <child v-bind:data="data" />
8 // 简写
9 <child  :data="data" />

v-on:

1 // 完整语法
2 <div v-on:click="clickFunc">按钮</div >
3 // 缩写
4 <div @click="clickFunc">按钮</div>
5 
6 // 完整语法
7 <child v-on:returnFunc="toReturnFunc" / >
8 // 缩写
9 <child @returnFunc="toReturnFunc" />

v-bind指令用于设置HTML属性：v-bind:href 缩写为 :href

v-on 指令用于绑定HTML事件 ：v-on:click 缩写为 @click

 

 

vue 生命周期：

图来自： https://segmentfault.com/a/1190000020173042?utm_source=tag-newest