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>
相关推荐
武子康27 分钟前
Java-145 深入浅出 MongoDB 基本操作详解:数据库查看、切换、创建集合与删除完整教程
java·数据库·sql·mysql·mongodb·性能优化·系统架构
阿巴~阿巴~1 小时前
Centos 7/8 安装 Redis
linux·服务器·数据库·redis·centos
刘大猫.1 小时前
mysql数据库压缩
数据库·mysql·压缩·mysql数据库压缩·数据库压缩·数据库备份与压缩
oracle04061 小时前
sql练习题单-知识点总结
数据库·sql
会飞的架狗师1 小时前
【MySQL体系】第4篇:MySQL 查询优化实用技巧
数据库·mysql
lypzcgf1 小时前
Coze源码分析-资源库-编辑数据库-前端源码-核心组件
前端·数据库·源码分析·coze·coze源码分析·ai应用平台·agent平台
wei_shuo2 小时前
KingbaseES聚焦产品上线
数据库·kingbasees
AI浩2 小时前
Redis中的RPOP、BRPOP、LPOP 和 BLPOP
数据库·chrome·redis
数据和云2 小时前
从Databricks和Supabase看AI时代的中国数据库启示
数据库·人工智能
我科绝伦(Huanhuan Zhou)2 小时前
Oracle ADRCI工具全面使用指南:从基础到故障诊断实战
数据库·oracle