ホームページ  >  記事  >  ウェブフロントエンド  >  Vueでメソッドを呼び出す方法

Vueでメソッドを呼び出す方法

亚连
亚连オリジナル
2018-06-07 11:30:114011ブラウズ

以下に、Vue で外部からメソッドを呼び出す方法に関する記事を共有します。これは非常に参考になるので、皆さんのお役に立てれば幸いです。

1. まず、パブリック vue コンポーネントを定義します。

var eventHub = new Vue();

2. 作成されたイベントの現在のコンポーネントで、$on を使用してパブリック コンポーネントのeventHub に渡します。translate はカスタマイズされており、getCardNum(data) が必要です。外部から呼び出されます;

eventHub.$on('translate', function (data) { 
        that.getCardNum(data); 
      });

3. 最後に、親コンポーネントで、負のコンポーネントを変数 var vm = new Vue({});

で保存する必要があることに注意してください。メソッドでは、メソッド内で $emit を使用して、パブリック コンポーネントでメソッドを受け取ります。

var vm = new Vue({ 
 el: '#example', 
 data: { 
  msg: 'Hello Directive', 
  data: {} 
 }, 
 methods: { 
  getCardNum: function (data, on) { 
   eventHub.$emit('translate', data); 
  } 
 } 
});

5. 最後に、vue コンポーネントの外またはファイルの外で getCardNum(data) 関数を呼び出すことができます。 onclick = vm を使用できます。getCardNum() は次のように呼び出されます。vm は親コンポーネントです

6。vue を使用した開発プロセスでは、親コンポーネントの変数名を vm.getCardNum();

として記述する必要があることに注意してください。 , Java バックグラウンドでポップアップ ページが発生しました。vue コンポーネントでメソッドを呼び出したいのですが、バックグラウンドでポップアップ ページが vue コンポーネントに存在せず、他のページが呼び出したいのは vue のメソッドだけです。は親コンポーネント内で呼び出されるということで、長い間検討しましたが、最終的には、コンポーネント内の function() メソッドを最上位の親コンポーネントに渡し、ネガティブコンポーネントを変数に保存することが決定しました。最後にメソッドは他のページで直接呼び出されます。呼び出し時には @click メソッドは使用できません。このように呼び出すと、呼び出しは onclick = vm.getCardNum(); になります。親コンポーネント

上記は私が皆さんのためにまとめたもので、将来皆さんのお役に立てれば幸いです。

関連記事:

Express によるクエリ サーバーの構築

vue-cli プロジェクトにおける ProxyTable のクロスドメインの問題

React コンポーネントでの refs の使用方法

以上がVueでメソッドを呼び出す方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

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