Vue组件分装之$attrs、$listener传递属性及事件

使用v-bind="$attrs"来将父组件的属性传递给自定义按钮

使用v-on="$listeners"将父组件的事件监听器传递给自定义按钮。

使用$slots获取父组件所有插槽以及作用域插槽对应的参数#[name]="scopeData"

这样,自定义按钮就能够直接响应父组件的事件,而不需要手动触发。

javascript 复制代码
  <Select ref="selectRef" v-bind="$attrs" v-on="$listener">
    <template v-for="(value, name) in $slots" #[name]="scopeData">
      <slot :name="name" v-bind="scopeData || {}"></slot>
    </template>
    <Option v-for="(item, index) in optionDatas" :value="item.value" :key="item.value + index">{{
      item.label
    }}</Option>
  </Select>
相关推荐
Hello.Reader10 分钟前
Redis 延迟监控深度指南
数据库·redis·缓存
ybq1951334543111 分钟前
Redis-主从复制-分布式系统
java·数据库·redis
好奇的菜鸟3 小时前
如何在IntelliJ IDEA中设置数据库连接全局共享
java·数据库·intellij-idea
tan180°3 小时前
MySQL表的操作(3)
linux·数据库·c++·vscode·后端·mysql
满昕欢喜3 小时前
SQL Server从入门到项目实践(超值版)读书笔记 20
数据库·sql·sqlserver
幽络源小助理4 小时前
SpringBoot基于Mysql的商业辅助决策系统设计与实现
java·vue.js·spring boot·后端·mysql·spring
Hello.Reader5 小时前
Redis 延迟排查与优化全攻略
数据库·redis·缓存
简佐义的博客6 小时前
破解非模式物种GO/KEGG注释难题
开发语言·数据库·后端·oracle·golang
爬山算法6 小时前
MySQL(116)如何监控负载均衡状态?
数据库·mysql·负载均衡
JAVA学习通7 小时前
Mybatis--动态SQL
sql·tomcat·mybatis