vueでv-forを使用すると赤色と警告が表示される問題を解決

今回は、vue で v-for を使用するとレッドフラグと警告が発生する問題を解決する方法をお届けします。以下は実際的なケースです。 コードレッドレポートは、美しいコードを追求する強迫性障害の人にとって非常に不快なものです。レッドレポートは次のとおりです:

コンソールには次のようなプロンプトも表示されます:

(Emitted value instead of an instance of Error) <Option v-for="item in searchTypeList">: component lists rendered with v-for should have explicit keys. See https://vuejs.org/guide/list.html#key for more info.

このレポートを解決するには、赤色の問題に関して、彼のプロンプトに従って、

loop

のときに一意のキーを追加する必要があります。ここでは、インデックスを使用することを選択します:

<ul 
class="clearfix course-list">
<li 
class="left" 
v-for="(item,index)
in gradeClassfy.primary.grade"
:key="index"><a
href="#" rel="external nofollow" >{{item.name}}</a></li>
</ul>

このようにして、赤色のレポートは消えます。 vue で v-for を使用する際の赤いレポートと警告の問題を解決するための上記の記事は、編集者が共有したすべての内容であり、参考になれば幸いです。また、皆様のご支援を願っています。スクリプトホーム。

この記事の事例を読んだ後は、この方法を習得したと思います。さらに興味深い情報については、php 中国語 Web サイトの他の関連記事に注目してください。

推奨読書:

Vue.directive() の詳細な図による説明

JsChart コンポーネントの使用法の詳細な説明

以上がvueでv-forを使用すると赤色と警告が表示される問題を解決の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。