解决vue同一slot在组件中渲染多次的问题


Posted in Javascript onSeptember 06, 2018

Q:今天写公共组件的时候碰到一个奇葩的情况,slot内部需要再次调用slot,这就会导致同一slot在组件中渲染多次引发的bug

A:把把父组件需要传入的dom结构作为props属性传递给slotRender,保证出来的dom结构不相同(尽管它们都是同一vnode渲染出来的)

解决vue同一slot在组件中渲染多次的问题

定义一个渲染slot的组件

子公共组件调用

解决vue同一slot在组件中渲染多次的问题

解决vue同一slot在组件中渲染多次的问题

父公共组件调用

解决vue同一slot在组件中渲染多次的问题

以上这篇解决vue同一slot在组件中渲染多次的问题就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
Mootools 1.2教程(3) 数组使用简介
Sep 14 Javascript
js四舍五入数学函数round使用实例
May 09 Javascript
node.js中的console.info方法使用说明
Dec 09 Javascript
JS拖拽插件实现步骤
Aug 03 Javascript
jQuery 中ajax异步调用的四种方式
Jun 28 Javascript
jQuery时间日期三级联动(推荐)
Nov 27 Javascript
Bootstrap模态框插入视频的实现代码
Jun 25 Javascript
js实现网页的两个input标签内的数值加减(示例代码)
Aug 15 Javascript
Node.js学习之查询字符串解析querystring详解
Sep 28 Javascript
AngularJS 应用模块化的使用
Apr 04 Javascript
彻底揭秘keep-alive原理(小结)
May 05 Javascript
vue实现可拖拽的dialog弹框
May 13 Vue.js
vue template中slot-scope/scope的使用方法
Sep 06 #Javascript
vue-cli 默认路由再子路由选中下的选中状态问题及解决代码
Sep 06 #Javascript
jQuery实现鼠标移入移出事件切换功能示例
Sep 06 #jQuery
Vue下拉框回显并默认选中随机问题
Sep 06 #Javascript
vue兄弟组件传递数据的实例
Sep 06 #Javascript
webpack4简单入门实例
Sep 06 #Javascript
jQuery实现动画、消失、显现、渐出、渐入效果示例
Sep 06 #jQuery
You might like
如何使用Strace调试工具
2013/06/03 PHP
PHP打开和关闭文件操作函数总结
2014/11/18 PHP
PHP之预定义接口详解
2015/07/29 PHP
php官方微信接口大全(微信支付、微信红包、微信摇一摇、微信小店)
2015/12/21 PHP
Netbeans 8.2与PHP相关的新特性介绍
2016/10/08 PHP
javascript 延迟加载技术(lazyload)简单实现
2011/01/17 Javascript
JQuery 返回布尔值Is()条件判断方法代码
2012/05/14 Javascript
javascript右下角弹层及自动隐藏(自己编写)
2013/11/20 Javascript
js判断当前页面用什么浏览器打开的方法
2016/01/06 Javascript
jQuery实现侧浮窗与中浮窗切换效果的方法
2016/09/05 Javascript
AngularJS 单元测试(一)详解
2016/09/21 Javascript
Flask中获取小程序Request数据的两种方法
2017/05/12 Javascript
详解webpack 如何集成第三方js库
2017/06/29 Javascript
Vue.js项目模板搭建图文教程
2017/09/20 Javascript
Nodejs+angularjs结合multiparty实现多图片上传的示例代码
2017/09/29 NodeJs
javascript实现QQ空间相册展示源码
2017/12/12 Javascript
vue 指令之气泡提示效果的实现代码
2018/10/18 Javascript
记一次用ts+vuecli4重构项目的实现
2020/05/21 Javascript
微信小程序实现选择地址省市区三级联动
2020/06/21 Javascript
JS简易计算器实例讲解
2020/06/30 Javascript
vue调用本地摄像头实现拍照功能
2020/08/14 Javascript
python连接sql server乱码的解决方法
2013/01/28 Python
Django集成百度富文本编辑器uEditor攻略
2014/07/04 Python
使用python开发vim插件及心得分享
2014/11/04 Python
Python随机生成信用卡卡号的实现方法
2015/05/14 Python
Python字符串匹配算法KMP实例
2015/07/18 Python
Python正则表达式知识汇总
2017/09/22 Python
pip matplotlib报错equired packages can not be built解决
2018/01/06 Python
Python实现接受任意个数参数的函数方法
2018/04/21 Python
python实现简单的单变量线性回归方法
2018/11/08 Python
Python连接Hadoop数据中遇到的各种坑(汇总)
2020/04/14 Python
matplotlib 画双轴子图无法显示x轴的解决方法
2020/07/27 Python
vue+django实现下载文件的示例
2021/03/24 Vue.js
致裁判员加油稿
2014/02/08 职场文书
马云北大演讲完整版:真心话,什么才是阿里的核心竞争力?
2014/04/04 职场文书
授权委托书公证
2014/09/14 职场文书