vue 在将作用域插槽传递给子元素时,插槽没有重新渲染,

biswetbf  于 6个月前  发布在  其他
关注(0)|答案(1)|浏览(91)

版本

2.7.14

复现链接

codesandbox.io

重现步骤

点击更改按钮

预期结果是什么?

插槽重新渲染

实际发生的情况是什么?

插槽没有重新渲染
要复现此问题,必须满足两个条件:

  1. slotscopedSlot 传递给父组件
  2. 父组件将 $scopedSlots 传递给子组件
    在拆解 $scopedSlots 后,此问题得到解决,但对于库开发人员来说,将 $scopedSlots 作为参数传递是非常常见的用法。
vlju58qv

vlju58qv1#

我认为这可能是因为你直接将 this.$scopedSlots 传递给了 Inner.data.scopedSlots,导致原本在 Wrapper.$scopedSlots 中定义的隐式属性 $stable 也传递到了 Inner.data.scopedSlots
所以这就是为什么使用展开运算符可以正常工作的原因,因为展开运算符不会扩展隐式属性。

excepted


.

actually(在你的例子中)

然后,由于 Vue 的插槽优化机制,最终导致了以下逻辑...

因此,Vue 重用了之前的 scoped slot 对象,从而减少了渲染开销。

相关问题