实现element的messageBox组件自定义VNode的功能

133 阅读1分钟

本文主要是记录如何往组件中动态插入slot插槽数据

1.引入组件text.vue,并且绑定ref属性

企业微信截图_20230809142755.png

2.在js代码中定义自己的VNode数据。我这里是把VNode数据统一放在scopedSlots这个object中

企业微信截图_20230809142550.png

3.通过ref把scopedSlots绑定到text.vue组件上。这里需要把先前定义好的VNode数据逐一加入到refs.test.refs.test.scopedSlots上。

企业微信截图_20230809142822.png

等同于在模板语法中的这种效果:

企业微信截图_20230815141402.png

此写法为非主流写法