ホームページ  >  記事  >  ウェブフロントエンド  >  vue の mixin についての簡単な説明

vue の mixin についての簡単な説明

小云云
小云云オリジナル
2017-12-13 09:07:391407ブラウズ

Vue は、コンポーネント コンテンツのより効率的な再利用を実現するために、混合メカニズム (ミックスイン) を提供します。最初は、これとコンポーネントに違いはないと思いました。 。後でそれが間違いだと分かりました。通常の状況におけるミックスインとインポートされたコンポーネントの違いを見てみましょう。コンポーネントが参照された後、親コンポーネント内に別のスペースを開いて、親コンポーネントの props からの値に基づいて対応する操作を実行することと同じであり、本質的に、この 2 つは別個であり、比較的独立しています。ミックスインは、コンポーネントを導入した後、データやその他のメソッド、メソッド、その他の属性などのコンポーネントの内部コンテンツを、親コンポーネントの対応するコンテンツとマージします。導入後、親コンポーネントの各種プロパティメソッドが拡張されたことに相当します。

単純なコンポーネントのリファレンス:

親コンポーネント + 子コンポーネント>>> 親コンポーネント + 子コンポーネント

ミックスイン:

親コンポーネント + 子コンポーネント>>> 注目に値します。ミックスインを使用する場合、親コンポーネントと子コンポーネントの両方が子コンポーネントにさまざまなプロパティ メソッドを持ちますが、これは、これらの変数を共有して同時に処理することを意味するものではなく、マージ以外に 2 つのコンポーネント間で何も行われないことを意味します。コミュニケーション。初めて mixin を見たとき、私は素朴にも vuex に似た下向きのデータ共有ソリューションだと思ったようで、とても興奮しました。

Vue のミックスインについてご紹介します

1. mixin とは

mixin ファイルは、vue コンポーネントの任意のコンポーネントを含めることができるオブジェクトです。これは、Vue コンポーネントの再利用可能な関数を配布するための非常に柔軟な方法です。ミックスインがコンポーネントによって使用されると、minxin 内のすべてのプロパティ/メソッドがコンポーネント内のプロパティ/メソッドと混合されます。

2 番目、ミックスインの使用

Vue コンポーネントにはミックスイン属性を持つことができ、この属性の値の型は配列です。 mixin 配列の要素 mixins として mixin を導入します。 [mixin]

コンポーネント A は mixin を適用し、メソッド、コンポーネント、ディレクティブなどの 2 つの属性が同じオブジェクトに混合されます。ディレクティブに同じ名前属性がある場合、ミックスイン内のディレクティブは無視されます。同じ名前のフック関数は配列にまとめられてすべて呼び出され、ミックスインのフック関数はコンポーネントのフック関数より前に呼び出されます。

関連するおすすめ:


riot.jsの学習[2] mixin

JSカスタムmixin関数の例

Mixinの概念とは何ですか?

以上がvue の mixin についての簡単な説明の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

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