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

スコープスロットが1つしかない場合は、次のことができるはずです。

<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タグでコンポーネントを使用する場合は、警告を使用する必要があると思います。

また、このコメントについてもう少し説明していただけませんか。

スコープスロットが1つしかない場合は、 `を実行できるはずです。

ありがとう!

コメントを更新しましたが、とにかく警告が表示されるようです。警告は実際には表示されないはずです。

これの状況はどうですか?

このページは役に立ちましたか?
0 / 5 - 0 評価