Vue: 在常规元素的动态组件内部使用时,作用域插槽会发出警告

创建于 2019-06-13  ·  4评论  ·  资料来源: vuejs/vue

2.6.10

复制链接

https://jsfiddle.net/mybeta/1dfwsazn/

重现步骤

当我使用DOM模板解析警告添加组件(例如<tr is="custom-row"> )时,如果未在控制台中收到警告,则无法使用作用域插槽(slotProps)。 我想用这种方式:

<tr is="custom-row" v-slot="slotProps">
    slotProps: {{slotProps.test}}
</tr>

期望什么?

没有警告。

实际发生了什么?

我在控制台中收到以下警告。

[Vue warn]: Error compiling template:
v-slot can only be used on components or <template>.

其余的看起来像预期的那样。

bug contribution welcome good first issue has PR warnings

最有用的评论

我更新了评论,但警告似乎仍然出现,警告实际上不应出现

所有4条评论

如警告所述, v-slot只能在包装器组件上使用或嵌套在组件本身中,但可以在template标签上使用。
以前, slot-scope允许这种用法,但已被删除,您可以签出RFC: https :

如果只有一个作用域的插槽,则应该能够

<tr :is="customComp" v-slot="data"></tr>

@posva ,非常感谢您的评论!

如建议的那样,我还尝试使用嵌套在template标记内的v-slot ,如下所示。

<div is="test-component">
  <template v-slot:default="slotProps">
    slotProps: {{slotProps.test}}
  </template>
</div>

但是也会产生警告,请参阅小提琴:
https://jsfiddle.net/mybeta/bhcoLwu3/

在避免DOM模板解析警告时,它可以正常工作:

<test-component>
  <template v-slot:default="slotProps">
    slotProps: {{slotProps.test}}
  </template>
</test-component>

但是我相信在tr标签上使用组件时,需要使用警告。

另外,您介意进一步解释此评论吗?

如果只有一个作用域内的插槽,则应该可以

谢谢!

我更新了评论,但警告似乎仍然出现,警告实际上不应出现

这是什么状态?

此页面是否有帮助?
0 / 5 - 0 等级