Vue常用指令和表单、事件修饰符的含义(萌新必看)

指令

v-text  只能输出文本,不解析标签
v-html  可以解析标签
v-bind  添加属性  简写形式  :
v-on  绑定事件   简写形式 @
v-cloak  解决 {{}} 闪烁问题 在标签内定义 v-cloak,然后在style样式里面写入
		 [v-cloak]{display:none}
v-model  双向数据绑定
v-once  添加这个指令,渲染的元素或者组件后期在修改不会跟着变化,静态
v-pre  可以阻止解析,会直接原样输出
v-if  v-else  v-else-if   显示隐藏
v-show  显示隐藏
v-for  列表渲染
v-slot  插槽  当子组件模板使用了slot 插槽后,子组件表内就可以写内容
		呈现在插槽中
directive  自定义指令
{{}}  输出指定数据

事件修饰符

.stop  阻止冒泡
.prevent  阻止默认行为
.capture  捕获,如果里面有冒泡的事件,谁加上它就先触发谁
.self  只有当 target 是当前元素才会被触发,冒泡和捕获都不能触发
.once  被它修饰的事件只会触发一次
.passive  不阻止默认行为,尽量不要和 parvent 一起使用,不然会失效
.enter  点了回车之后才能执行

表单修饰符

.lazy  不会实时更新,当你按下回车,才会更新一次
.trim  去除表单两边的空白符
.number  input输入的内容默认是字符串类型,可以使用 number 表单修饰符
		和它转换成数值类型

这次写的比较精简,希望能够帮助刚学习 Vue 的萌新方便理解.下期见!

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值