Closed b2nil closed 4 years ago
函数也会有警告是啥鬼
@wmdsj-z
ElTable 的子节点也需要传入函数式插槽,直接传数组是会报警告信息的。
createVNode(ElTable, {}, { default: () => [
createVNode(ElTableColumn, {}),
...
]})
谢谢!
我今天看到你的问题 解决了 我也遇到了 报了警告 Non-function value encountered for default slot. Prefer function slots for better performance
[Vue warn]: Slot "columns" invoked outside of the render function: this will not track dependencies used in the slot. Invoke the slot function inside the render function instead.
v-slots={{ columns: () => slots.tableColumns() }} 我应该肿么使用?
@Minitiai
使用 jsx 的话,遵照 @vue/jsx-next
的语法来用。
从错误信息来看,你应该将代码放到 render 函数里面。
// 在 setup 中返回 render 函数
setup(props, { slots }) {
...
return () => {
return (/* jsx 代码 */)
}
}
// 或直接使用 render
render() {
return (/* jsx 代码 */)
}
开发工具所报的警告信息如下:
原因是组件插槽所插入的是插槽内容,而非函数值。Vue3 推荐使用函数式插槽,以便获得更佳的性能。
正确的写法如下: