Vue を使い始めるときは、コンポーネントについて言及する必要があります。場合によっては、コンポーネントは相互に値を渡す必要があります。たとえば、親コンポーネントは子コンポーネントに値を渡し、子コンポーネントは子コンポーネントに値を渡す必要があります。コンポーネントは親コンポーネントに値を渡す必要があるため、次のように強度を使用して詳細を説明します。
効果:
こんな効果を実現したいのですが、入力ボックスに文字を入力して送信ボタンをクリックすると、対応する入力内容が下に表示されます。何かをクリックすると、コンテンツが消えます。
以下に示すように、たとえば 2 をクリックすると 2 が消えます
##分析:
1. まず、入力コンテンツを取得し、すべての入力コンテンツを配列に収集し、
でデータをループします。
は同じ構造なので、
をコンポーネントにできます。配列は親レイヤーにあり、定義された
コンポーネントは子コンポーネント。これは、親コンポーネントが子コンポーネントに値を渡し、データを子コンポーネントに渡すことを意味します。2. オプションの
をクリックすると、オプションが表示されなくなります。次に、
コンポーネントは、現在どのコンポーネントがクリックされているか、および親レイヤーの配列データのどれを削除する必要があるかを親コンポーネントに上向きに通知します。これは値を渡すサブコンポーネントです。親コンポーネント。
コードを通して、サブコンポーネントから親コンポーネントに渡される主な値がここにあることを見つけるのは難しくありません:
this.$emit('delete',this.index);
ログイン後にコピー
さらに、次のことに注意してください。 Vue では、$ で始まるものはすべて vue インスタンス属性またはメソッドと呼ばれます。これに加えて、などのいくつかの略語にも注意する必要があります。
以上がVue コンポーネント間の値の転送の強さの分析の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。