关于vue中插槽,自定义指令,组件进阶的用法

插槽

1.插槽的作用:让组件的使用更灵活

2.插槽的基本作用:①在组件内使用<slot></slot>标签占位 ②在使用组件的标签中传入自定义标签

3.设置默认内容:在slot标签内容中所写的就是默认内容

4.具名插槽:①作用:在组件内有多处标签不确定时使用 ,根据slot的name属性来接受不同的标签 ②用法:1.在组件内的slot标签里设置name属性 2.在使用组件时使用template标签配合指定名称

5.作用域插槽:①作用:使用组件时能访问组件内的数据 ②用法:1.在组件内的slot标签上动态绑定数据 2.在使用组件时v-slot="变量名"来接受绑定的数据

自定义指令

1.自定义指令的作用:当内置指令无法满足需求时使用

2.用法:①注册:全局注册:Vue.directive('指令名',{inserted(el){}})②局部注册 directives:{指令名:{inserted(el){}}}

3.使用:在标签上v-自己定义的指令名

组件进阶

$refs:作用:1.获取DOM元素 2.获取组件对象 用法:1.给标签添加ref属性2.使用this.$refs.名称获取

$nextTick:作用:等待下一次DOM更新结束后执行  用法:this.$nextTick(()=>{该回调函数会在下一次DOM更新后执行})

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值