データ転送時のvueの操作方法

php中世界最好的语言
php中世界最好的语言オリジナル
2018-06-07 11:22:551926ブラウズ

今回はvueをデータ転送する際の操作方法と、vueをデータ転送する際の注意点を紹介します。

コンポーネントは Vue.js の最も強力な機能です。コンポーネントは再利用可能なコードをカプセル化し、異なるオブジェクトを渡すことでコンポーネントの再利用を実現できますが、コンポーネントの値の転送は解決すべき問題になります。

1. 親コンポーネントが子コンポーネントに値を渡す

コンポーネントインスタンスのスコープは分離されています。これは、親コンポーネントのデータを子コンポーネントのテンプレート内で直接参照できないことを意味します。子コンポーネントに親コンポーネントのデータを使用させるには、子コンポーネントの props オプションを渡す必要があります。

サブコンポーネント:

子组件需要从父组件获取 logo 的值,就需要使用 props: ['logo']

サブコンポーネントが親コンポーネントからロゴの値を取得する必要がある場合は、小道具を使用する必要があります: ['logo']

データ転送時のvueの操作方法

親コンポーネント:

データ転送時のvueの操作方法

2. サブコンポーネント 親コンポーネントに値を渡す

子コンポーネントは主にイベントを通じて親コンポーネントにデータを渡します。

サブコンポーネント:

データ転送時のvueの操作方法データ転送時のvueの操作方法

ここで、transferUser はカスタム イベントであり、this.username はこのイベントを通じて親コンポーネントに渡されます。

親コンポーネント:

データ転送時のvueの操作方法データ転送時のvueの操作方法

getUser メソッドのパラメーター msg は、子コンポーネントから渡されるパラメーター ユーザー名です

3。ルーティング値

データ転送時のvueの操作方法データ転送時のvueの操作方法

使用される場合、ライフ内で作成されます。サイクルの割り当て。

データ転送時のvueの操作方法

4. localStorage または sessionStorage を介してデータを保存します

データ転送時のvueの操作方法

さらに興味深い情報については、他の関連記事に注目してください。 php中国語のウェブサイトです!

推奨読書:

vueでv-cloakロード時のちらつきに対処する方法

Vueを操作してプロキシを作成する方法

以上がデータ転送時のvueの操作方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。