ホームページ > 記事 > ウェブフロントエンド > vuejsでデータを渡す方法は何ですか
送信方法: 1. 親コンポーネントは props を使用して子コンポーネントにデータを転送します。 2. 子コンポーネントはイベントを通じて親コンポーネントにデータを転送します。 3. ルーティングを使用してデータを転送します。 4. localStorage を使用します。または sessionStorage を使用してデータを保存し、getItem を使用してデータを取得します。 5. Vuex を使用してデータを転送します。
このチュートリアルの動作環境: Windows 7 システム、vue バージョン 2.9.6、DELL G3 コンピューター。
コンポーネント (Component) は、 Vue.js の最も強力な機能です。コンポーネントは再利用可能なコードをカプセル化し、異なるオブジェクトを渡すことでコンポーネントの再利用を実現できますが、コンポーネントの値の転送は解決すべき問題になります。
1. 親コンポーネントが子コンポーネントに値を渡す
コンポーネント インスタンスのスコープは分離されています。これは、親コンポーネントのデータを子コンポーネントのテンプレート内で直接参照できないことを意味します。子コンポーネントに親コンポーネントのデータを使用させるには、子コンポーネントの props オプションを渡す必要があります。
サブコンポーネント:
サブコンポーネントは、から ロゴを取得する必要があります。親コンポーネント の値には、 props: ['logo']
# を使用する必要があります。#親コンポーネント:
##2. 子コンポーネントは親に値を渡しますコンポーネント
サブコンポーネントは主に、イベントを通じて親コンポーネントにデータを渡します。
サブコンポーネント:
##transferUser はカスタム イベントです。this.username は、このイベントを通じて親コンポーネント に渡されます。 #親コンポーネント
:
##getUser
メソッドのパラメータmsg はサブコンポーネントから渡されるパラメータです。 username3 .Route値の受け渡し
使用すると、作成されたライフサイクルで値が割り当てられます。
4. localStorage または を渡します。 sessionStorageデータを保存するには
##5 。 Vuex
アプリケーションが複雑な場合は、vuevuex を使用することをお勧めします。公式ウェブサイトで推奨されています。
#https://vuex.vuejs.org/zh-cn/getting-started.html
関連推奨事項: "
vue.js チュートリアル以上がvuejsでデータを渡す方法は何ですかの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。