在Vue开发中，经常用到的三个缩写符号：
第一个是冒号，是v-bind的缩写，表示标签的属性值取vue的数据属性值。
比如：
<a :href='url'>万码学堂</a> <a v-bind:href='url'>万码学堂</a>
第二个是@符号，是v-on指令的缩写，表示触发事件。
比如：
<button @click="handleClick">万码学堂</a> <a v-on:click='handleClick'>万码学堂</a>
第三个是#符号，是在使用vue组件的插槽时的v-slot缩写。
比如：
//假如组件<base-layout>定义中使用了具名插槽 <div class="container"> <header> <slot name="header"></slot> </header> <main> <slot></slot> </main> <footer> <slot name="footer"></slot> </footer> </div> //我们使用组件的时候就需要如下写法： <base-layout> <template v-slot:header> <h1>万码学堂创办自2008年</h1> </template> <template v-slot:default> <p>好的方法让学习更有趣</p> <p>www.wanmait.com</p> </template> <template v-slot:footer> <p>做最负责任的教育</p> </template> </base-layout> //我们可以使用#，如下： <base-layout> <template #header> <h1>万码学堂创办自2008年</h1> </template> <template #default> <p>好的方法让学习更有趣</p> <p>www.wanmait.com</p> </template> <template #footer> <p>做最负责任的教育</p> </template> </base-layout>
0条评论
点击登录参与评论