息子コンポーネントはVUE上で通信します
著者:フォックスの魚ハウス
このリンク:VUEのコンポーネントが通信
GitHubの:sueRimn
コンポーネントは、単一のページがある場合は、コンポーネント間の親子関係があり、あなたは親子アプローチの状態に応じて、異なるデータ転送を使用する必要があります。
新しい電子-VUEプロジェクトで説明するには、2つのコンポーネントが付属しています。
次のようにディレクトリ構造は次のとおりです。
前記親コンポーネントLandingPage.vue、SystemInformation.vueサブアセンブリ。
親コンポーネントは、サブアセンブリにデータを渡します
データは、小道具を介して親コンポーネントサブアセンブリに渡すことができます。
サブコンポーネント:
親コンポーネントへのデータの取得から表示サブアセンブリNEWNAME、NEWPWD使用して、小道具を。
親コンポーネント:
コンポーネントを呼び出す代わりに使用V-バインドサブアセンブリデータ名表示するには、親コンポーネントで定義されたバインド変数NEWNAME、NEWPWDを。
その後、データは、親コンポーネントの転送もサブアセンブリ内に表示することができます。
第二に、データは、親サブアセンブリの構成要素に伝達されます。
サブアセンブリ$が発する親コンポーネントのイベントへのパスデータを。
サブコンポーネント:
データサブコンポーネントのユーザ名によって、変更イベントメソッドを呼び出します)(SETUSERを、トリガー$発し、その後、イベント、カスタムイベントとはの親コンポーネントに送らchangeName
親コンポーネント:
父组件的changeName事件调用getUser方法,获取从子组件传递的参数username。
getUser 方法中的参数 msg 就是从子组件传递过来的参数 username。
以下动图中,输入框与welcome是属于子组件,嵌套在父组件中,输入框输入值,传递给父组件显示。