VueJS を使用した ComboBox テンプレート コンポーネント

Question

<p>私は <code>vuejs v3</code> を使用しますコンボボックスを作成します。型板部品、此我有以下代：</p> <pre class="brush:html;toolbar:false;"><テンプレート> <select name={{selector_name}} class= "コンボボックス" id={{selector_id}}> v-for=オプトイン {{selector_options}} <オプション値=opt> 選択する </オプション> </選択> </テンプレート> <スクリプト> デフォルトのエクスポート { 名前: 'コンボボックス', データ（） { 戻る { セレクター名: null、 selector_id: null、 selector_options : null、 } }、 小道具: { セレクター名: { タイプ: 文字列、 必須: true }、 セレクター ID: { タイプ: 文字列、 デフォルト: 「コンボボックス」 }、 セレクターオプション: { タイプ: 配列、 必須: true } }、 メソッド: { onChange: (イベント) => { console.log(event.target.value); }、 }、 計算: {}、 } </スクリプト> </pre> <p>ただし、私は <code>v-for</code> を使用しています。 </p>この方法は私にとって不当であるように見えますが、私がどのように正しいのかを報告することができます。

Answer 1

あなたの質問に明確に答えるために、要素には v-for が使用されていることがたくさんあります。

リーリー

プロップとデータを同じ名前で定義することはできません。 Props、プロパティと値をデータに挿入します。 まったく同じですが、データは親から取得され、親から子に値を渡します。

したがって、データを渡す必要がある場合は、props を使用しますが、データ内で定義しないでください。

これらすべての 実例 があります (読みやすさを向上させるために、小道具の代わりにデータを使用しています)。