javascript - vue公式ドキュメントのv-modelバインディング値の説明

Question

しかし、値を Vue インスタンスの動的プロパティにバインドしたい場合もあります。この場合、v-bind を使用してこれを実現でき、このプロパティの値は文字列である必要はありません。

質問:
1. 上の段落を詳しく説明してください
2. 次のコードを組み合わせて完全なデモを作成します

チェックボックス

リーリー

単一ボタン

リーリー

リスト設定の選択

リーリー

Answer 1

これは、ラジオ、チェックボックス、または選択オプションの値を指します。静的な文字列、またはインスタンス データや計算された属性などのインスタンス属性にすることができます。

実際、次の例が詳細に示されています:
<input type="radio" v-model="picked" value="a"> 当用户点选该 radio 时， vm.picked 是字符串 "a"，而 <input type="radio" v-model="pick" v-bind:value="a">、ユーザーが選択すると、vm.pick は vm.a のインスタンス属性になります。

選択リストの例も分かりやすいです。

実際、コードを入力して自分で実行すると、ほぼ理解できるようになります。ただし、コードを入力すると、いくつかのエラー メッセージが表示されることがあります (a のインスタンス データがない場合は、バインドされたデータを要求するプロンプトが表示されます)。現時点では、データに a を追加するだけです)。Vue が中国語の学習者にとってあまり親切ではないのは、コンソールのエラー プロンプトがすべて英語であることです。英語は抑止されるかもしれない。