当前位置: 首页 > news >正文

Vue2——5

自定义指令

自己定义的指令, 可以封装一些 dom 操作, 扩展额外功能 

使用

指令的值

在绑定指令时,可以通过“等号”的形式为指令绑定具体的参数值

通过 binding.value 可以拿到指令值,指令值修改会触发update函数

插槽

作用:让组件内部的一些结构支持自定义

默认插槽

组件内需要定制的结构部分,改用<slot></slot>占位

使用组件时, 组件标签内部, 传入结构替换slot

默认插槽只能改变一处

后备内容(默认值)

插槽后备内容:封装组件时,可以为预留的 `` 插槽提供后备内容(默认内容)。

具名插槽

组件内有多处结构,需要外部传入标签,进行定制时可以使用具名插槽

多个slot使用name属性区分名字

template配合v-slot:插槽名(可以简化成 #插槽名) 来分发对应标签

作用域插槽

作用域插槽是 Vue.js 中一种强大的组件通信机制,允许子组件向父组件传递数据,并让父组件在渲染时动态使用这些数据。它解决了普通插槽无法访问子组件数据的限制。

定义 slot 插槽的同时, 是可以传值的。给 插槽上可以绑定数据,将来使用组件时可以用。

给slot以添加属性的方式传值

slot会将所有值放在一个对象里

通过template绑定对应插槽来接受传过来的对象 obj为自定义名字

http://www.dtcms.com/a/296324.html

相关文章:

  • set集合(HashSet、LinkedHashSet、TreeSet)
  • MySQL数据库迁移至国产数据库测试案例
  • 二、计算机网络技术——第6章:应用层
  • 深入理解 ThreadLocal:从原理到最佳实践
  • Vue实现地图图片动态轨迹组件,支持放大缩小重置,兼容触摸等
  • Uniapp中使用vue3语法
  • vue3升级了哪些重要功能
  • vite+vue3 工程-SVG图标配置使用指南——vite-plugin-svg-icons 插件
  • pytest中使用skip跳过某个函数
  • 4.1.2 XmlInclude 在 C# 中的作用及示例
  • 【软件与环境】--SSH连接远程服务器工具:FinalShell
  • C语言:详解文件操作
  • 【Java工程师面试全攻略】Day12:系统安全与高可用设计
  • 嵌入式linux I2C 设备开发调试 使用i2cget 工具失败的问题
  • JavaScript性能优化实战指南:从原理到最佳实践
  • Flink-1.19.0源码详解7-Flink集群端调度
  • 跨境支付入门~国际支付结算(区块链篇)
  • jina-embedding-v4 环境搭建全过程
  • 2025年“创新杯”(原钉钉杯) B题 详细建模思路
  • 牛客网刷题进阶挑战VL25——VL49
  • 【Linux网络编程】传输层协议 - UDP
  • 【数据结构初阶】--二叉树(二)
  • M²IV:面向大型视觉-语言模型中高效且细粒度的多模态上下文学习
  • BI 系统数据看板全解析:让数据可视化驱动业务决策
  • ESP32使用 vscode IDF 创建项目到烧录运行全过程
  • C++学习笔记(八:函数与变量)
  • 云原生架构下的服务器运维挑战与解决方案
  • 【CVPR 2025】即插即用,MobileMamba三阶段架构+Wavelet增强,颠覆轻量模型格局!
  • Qt Quick 3D渲染
  • 云端哨兵的智慧觉醒:Deepoc具身智能如何重塑工业无人机的“火眼金睛”