メソッドはウォッチャーコールバック関数の関数ではありません

Question

私はvueJSでプロジェクトをコーディングしています。私は次のコードで構成しました：私は、プロジェクト内のエラーを以下まし

import ProjectsStore from './../stores/ProjectsStore.js'; 

export default { 
    store: ProjectsStore, 
    data() { 
     return { 
      loading: false, 
      randomProject: null, 
     } 
    }, 
    computed: { 
     projects() { 
      return this.$store.state.projects; 
     }, 
     commits() { 
      return this.$store.state.commits; 
     } 
    }, 
    methods : { 
     setCommit :()=> { 
      // code here 
     } 
    }, 
    watch: { 
     projects: (value) => { 
      this.setCommit() 
     } 
    }, 
    mounted() { 
     this.$store.dispatch('loadProjectsList') 
    } 
} 

がコールバックを見て：

this.setCommit is not a function 

私はコールバックでconsole.log (this)を入れて、それがデフォルトのオブジェクトではないVueComponentを表示します。

私は間違っていましたか？

ありがとうございました。

Answer 1

試行錯誤の代わりに構文を変更し、何が効果があるかを見るためには、特定のコードがなぜ機能するのかを理解すればよいでしょう。 VUE documentationで述べたよう

：

（例えばvm.$watch('a', newVal => this.myMethod())）インスタンスのプロパティの矢印機能を使用しないでください。矢印関数が親コンテキストにバインドされているので、は期待通りのVueインスタンスではなく、this.myMethodは未定義となります。

あなたがes6の矢印機能を使い慣れていれば、hereは、矢印機能のかなり良い説明ですこののバインディングが動作します。 （）=> {：あなたははっきりそして

は私の答えはあなたにいくつかの助けをこの上