指令带参数
大家一定不陌生v-bind,我们上一节课 说 ,v-开头的都是 vue自己做的一些指令,讲了一个v-if指令,用来控制元素标签是否显示隐藏。
但是这个v-bind,也是一个指令。我们一开始认识它的时候,是说属性绑定的章节,那节课里,我们从属性为角度切入,说前面加个v-bind: 就是绑定到了vue的变量了可以。
但是本节课我们要重新从v-bind自身的角度讲起,v-bind是一个指令,它要带着参数,才行。而v-bind:class 中,这个class就是一个参数,也就是说,v- 指令有一些是要带着参数的,而v-bind这个指令的参数就是 元素的属性!
它的作用不用多说了,大家都知道了。v-bind可以带的其他属性有很多,比如v-bind:href,v-bind:name 等等。
其他的指令我们后面会讲,但是这里先给大家提前认识一个:v-on指令,v-on也是要带参数的,它的参数之一就是click 。
连起来就是v-on:click = "方法名" 作用是执行某些函数方法动作等。相当于原生html中的onclick。
指令带修饰符
刚刚说完指令可以带参数,现在要讲的是,指令也可以带修饰符,不得不说,这个设计确实很优秀。
那么什么是修饰符呢?答:就是对这个指令绑定后面变量/方法的时候,使用特殊方式。
那么怎么用修饰符呢?答:在参数后加.修饰符即可,如:v-on:click.prevent='' 其中v-on是指令,click是参数,.prevernt就是修饰符。意思是什么大家暂时可以不用明白,先背好这个结构。
本节课我们知道了,指令后是可以接参数和修饰符的。具体有什么到时候我们直接百度即可,因为实在太多了,不过我们现在已经学会了这个用法,到时候百度也能看的懂了。