nutui icon indicating copy to clipboard operation
nutui copied to clipboard

Slot "default" invoked outside of the render function

Open pangzhen opened this issue 2 years ago • 1 comments

NutUI scenes(nutui 场景)

小程序(@nutui/nutui-taro)

NutUI-vue version(nutui-vue 版本)

4.0.9

Vue version(vue 版本)

3.3.4

Operating environment(运行环境)

dev:weapp

Citation method(引用方式)

npm

Node version(node 版本)

v18.16.0

Browser and its version(浏览器及其版本)

版本 108.0.5359.124(正式版本) (arm64)

System and its version(系统及其版本)

MacOS 11.3

Taro environmental information(taro 环境信息)

Taro v3.6.7

Reproduction link(重现链接)

nutui.jd.com/taro/vue/4x/

Steps to reproduce(重现步骤)

只要用jsx写法就会出现这种警告,包括form组件也会出现这种情况
return () => ( <div> <nut-collapse> <nut-collapse-item title="title" name="0"> aaaaaaaaa </nut-collapse-item> </nut-collapse> </div> );

What is expected?(期望的结果是什么?)

没有警告

What is actually happening?(实际的结果是什么?)

._node_modules_@vue_runtime-core_dist_runtime-core.esm-bundler.js:41 [Vue warn]: Slot "default" invoked outside of the render function: this will not track dependencies used in the slot. Invoke the slot function inside the render function instead. at <NutCollapseItem title="title" name="0" > at <NutCollapse> at <Index tid="pages/test/index?$taroTimestamp=1687076642152" option= {} > at <Anonymous key="pages/test/index?$taroTimestamp=1687076642152" > at <App>

pangzhen avatar Jun 18 '23 08:06 pangzhen

排查原因发现是 Collapse 组件中在模板渲染之外的地方用到了 slots.default(),主要是为了监听子组件变化以重新初始化组件。 测试了在 @vitejs/plugin-vue-jsx 下是正常的,在 @vue/babel-plugin-jsx 中则会报警告,但不影响使用。 其他几个组件也有类似的逻辑,需要进一步优化。

eiinu avatar Jun 20 '23 01:06 eiinu