这里就很自然的产生一个新问题：如何给相应的子组件传props？

解答：直接通过$attrs $listeners实现祖孙通信。

<!-- 传值通过$attrs $listeners 实现祖孙传值通信 -->
 <component :is="currentForm" @closeDialog="closeDialog" v-bind="$attrs" v-on="$listeners"></component>

vue <compent> 结合is实现动态切换子组件的更多相关文章

  1. Vue.js 动态挂载子组件

    直接来实例 父组件 <template> <div> <div :is="sub.content" :ref="sub.name" ...

  2. vue 父到子动态传值 子组件实时渲染

    近期项目中需要一个功能,根据选择不同的 团队片区 id 展示不同的数据,团队id 在父组件  数据在子组件中展示. 根据不同的团队 动态渲染数据总览. 父组件: <Cards ref=" ...

  3. vue中通过.sync修饰符实现子组件修改父组件数据

    vue父子通讯是单向数据流,也就是子组件不能修改父组件的值,但是在一些情况下是需要这样做的. 先看官方文档: 接下来举例实现 1.实现一个双向数据绑定,子组件改变的时候,父组件也在改变 父组件 < ...

  4. vue中.sync修饰符，实现子组件实时更新父组件的值

    vue 修饰符sync的功能是:当一个子组件改变了一个 prop 的值时,这个变化也会同步到父组件中所绑定. 不过它有一个前身,先来看看.sync出现之前是如何实现的 父组件中(传递给子组件一个值:p ...

  5. vue中把一个事件绑定到子组件上

    官网上是这样描述的 你可能有很多次想要在一个组件的根元素上直接监听一个原生事件.这时,你可以使用 v-on的 .native 修饰符 父组件App.vue <template> <d ...

  6. vue全局引入公共scss样式，子组件调用

    前提 已引用并使用scss npm install sass-loader --save-dev npm install node-sass --sava-dev 配置 在vue.config.js中 ...

  7. Vue.js 2使用中的难点举例--子组件，slot, 动态组件，事件监听

    一例打尽..:) <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> < ...

  8. vue 根据下拉框动态切换form的rule

    taskCategorySelect (val) { // 任务类别下拉选择 if ( val == 5 ) { this.cameraORgateway = false; // true不可以使用 ...

  9. Vue less使用scope时渗入修改子组件样式

    @deep: ~'>>>'; .wrap { @{deep} .component1 { width: 120px; } }

随机推荐

  1. 怎么在微信公众号上传PPT？

    我们都知道创建一个微信公众号,在公众号中发布一些文章是非常简单的,但公众号添加附件下载的功能却被限制,如今可以使用小程序“微附件”进行在公众号中添加附件. 以下是公众号添加附件使用“微附件”小程序的教 ...

  2. 1. JDK基础说明

    1. JDK基础说明 版本及新特性获取 作为技术人,关注新技术必不可少,那么最佳的途径...看下面. 在 Oracle Java 官方站点有这个非常好的引导地图 官方站点 https://docs.o ...

  3. 关于手机数码圈KOL的一两点感想

    复工以来,高峰时段9号线地铁上的人依旧不少,安全距离啥的肯定是不用想了,只是从原来的4G手机换成5G手机以后在某些站能接收到5G信号,我终于能在一些原来根本没信号的站里愉快的刷一刷微博和酷安了. 但是 ...

  4. Linux探测工具BCC(网络)

    Linux探测工具BCC(网络) 承接上文,本节以ICMP和TCP为例介绍与网络相关的部分内容. 目录 Linux探测工具BCC(网络) Icmp的探测 TCP的探测 Icmp的探测 首先看下促使我学 ...

  5. Java—包装类/System类/Math类/Arrays类/大数据运算/Collection接口/Iterator迭代器

    基本类型包装类 8种基本类型对应的包装类如: 将字符串转成基本类型: 将基本数值转成字符串有3种方式: 基本类型直接与””相连接即可:34+" " 调用String的valueOf ...

  6. C#算法设计排序篇之08-计数排序（附带动画演示程序）

    计数排序(Counting Sort) 该文章的最新版本已迁移至个人博客[比特飞],单击链接 https://www.byteflying.com/archives/689 访问. 计数排序是一个非基 ...

  7. 深入解析Laravel的中间件

    Laravel 中间件是什么? 简而言之,中间件在 laravel 中的作用就是过滤 HTTP 请求,根据不同的请求来执行不同的逻辑操作. 我们可以通过中间件实现以下功能: 指定某些路由 设置 HTT ...

  8. PostgreSQL在没有备份情况下误删除Clog恢复

    创建实验表postgres# create table t (n_id int primary key,c_name varchar(300));CREATE TABLEpostgres# inser ...

  9. [源码解析] Flink UDAF 背后做了什么

    [源码解析] Flink UDAF 背后做了什么 目录 [源码解析] Flink UDAF 背后做了什么 0x00 摘要 0x01 概念 1.1 概念 1.2 疑问 1.3 UDAF示例代码 0x02 ...

  10. 微软看上的Rust 语言，安全性真的很可靠吗

    摘要:近几年,Rust语言以极快的增长速度获得了大量关注.其特点是在保证高安全性的同时,获得不输C/C++的性能.在Rust被很多项目使用以后,其实际安全性表现到底如何呢? 近几年,Rust语言以极快 ...