这里就很自然的产生一个新问题:如何给相应的子组件传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. easyPOI使用

    更多的easyPOI资源的网在easypoi的官网. 1 在pom.xml中添加依赖 <dependency> <groupId>cn.afterturn</groupI ...

  2. Spring Boot 集成 Elasticsearch 实战

    最近有读者问我能不能写下如何使用 Spring Boot 开发 Elasticsearch(以下简称 ES) 相关应用,今天就讲解下如何使用 Spring Boot 结合 ES. 可以在 ES 官方文 ...

  3. Vue 使用$set动态给数据设置属性

    在实际的开发过程中,给表单元素绑定model的时候,绑定的元素的属性是根据后台数据动态生成的.如果使用常规的赋值方式,是无法更新视图的 需要使用, this.$set(dataName,keyName ...

  4. JavaScript call的示例

    作用: 改变函数执行时的作用域 let name = 'global name' function say(){ console.info(arguments) // 调用时接收的参数个数 conso ...

  5. c++ sort函数三个参数解释

    第一个参数 一般为 排序的起始点 vector.begin()(起点) 或者其他位置 第二个参数 一般为 排序的终止点 vector.end() (终点) 或者其他位置 第三个参数是排序函数 对于一些 ...

  6. mosquitto基于SSL/TLS安全认证测试MQTT

    一.环境搭建 1.mosquitto介绍 mosquitto是一个实现了MQTT3.1协议的代理服务器,由MQTT协议创始人之一的Andy Stanford-Clark开发,它为我们提供了非常棒的轻量 ...

  7. 阿里云体验实验室 教你如何《快速搭建LNMP环境》

    ## 体验平台简介 面向开发者和中小企业打造的一站式.全云端的开发平台,打开浏览器就可以开发.调试.上线,所测即所得,并结合无服务器的模式,重新定义云原生时代的研发工作方法论.旨在降低开发者上手成本和 ...

  8. Excel 科学计数法数值转换

    问题场景 如果导出的数据文件后缀为.CSV,一般数值类型的数据超过12位后,单元格的数据就用科学计数法来表示了. 比如身份证号.较长的id,数值会超过12位,而科学计数法表示,不方便查看或操作,很多情 ...

  9. C++ Templates (1.5 重载函数模板 Overloading Function Templates)

    返回完整目录 目录 1.5 重载函数模板 Overloading Function Templates 1.5 重载函数模板 Overloading Function Templates 和普通函数一 ...

  10. Jmeter系列(56)- 详解 Weighted Switch Controller 权重控制器

    如果你想从头学习Jmeter,可以看看这个系列的文章哦 https://www.cnblogs.com/poloyy/category/1746599.html 简单介绍 它能分配其子项目(Child ...