Vueコールバックメソッドでは、現在のコンポーネントthis要素が取得されないソリューション

2765 ワード

イベントサブスクリプション$onを使用するか、axiosを使用してデータを要求する場合、コールバックメソッド内でデータをリフレッシュしたり、他の本コンポーネントを呼び出したりする方法は、呼び出せないことに気づきました.thisは現在のコンポーネントのvueインスタンスを指さすことができず、TypeError:this.xxx is not a functionまたはその他をプロンプトします.
解決方法:使用=>
  • //   
    globalBus.$on("test.order.new",function(data){
         
    	//       
    	consolo.log(data);
    	//          ,        **  ,this    
    	this.update(data);
    });
    
    //   
    globalBus.$on("test.order.new",(data) => {
         
    	//       
    	consolo.log(data);
    	//          ,        **  ,this    vue  
    	this.update(data);
    });
    

    =>とfunction()の匿名関数は異なります.function匿名関数thisは、実行時に実際にメソッドを呼び出すオブジェクトを指します.=>自分のthisはありません.ここでthisは作成時に確定しました.利点は、現在のコンポーネントを探す方法に困らないことです.欠点は、矢印関数がコンストラクタとして使用できず、newと一緒に使用するとエラーが放出されます.
    原文を参考にする.