VueJSこれはlodashスロットルの方法で

Question

私はVueJSアプリケーションでメソッドを絞り込もうとしています。

export default { 
    data() { 
     return { 
      foo: 'bar' 
     } 
    }, 
    methods: { 
     doSomething() { 
      console.log('olas') 
     } 
    }, 
    created() { 
     _.throttle(this.doSomething,200) 
    } 
} 

しかしdoSomething方法は、単に解雇されませんでした：私は、最初に次のように試してみましたhttps://jsfiddle.net/z4peade0/

その後、私はこの試みた：

export default { 
    data() { 
     return { 
      foo: 'bar' 
     } 
    }, 
    methods: { 
     doSomething: _.throttle(() => { 
      console.log('olas') 
     },200) 
    }, 
    created() { 
     this.doSomething() 
    } 
} 

をそしてfunctiongがトリガされます：https://jsfiddle.net/z4peade0/1/

問題があります。絞り込みメソッド内のfooプロパティにアクセスできません：

export default { 
    data() { 
     return { 
      foo: 'bar' 
     } 
    }, 
    methods: { 
     doSomething: _.throttle(() => { 
      console.log(this.foo) // undefined 
     },200) 
    }, 
    created() { 
     this.doSomething() 
    } 
} 

私のような何かをしようとした

：成功せず

const self = { 
    ... 
    methods: { 
     doSomething: _.throttle(() => { 
      console.log(self.foo) 
     },200) 
    }, 
    ... 
} 

export default self 

を

どのように私はlodashがVueJS法に法を絞って、thisコンテキストを使用して使用することができますか？

Answer 1

間違ったコンテキスト（this）をバインドする矢印関数を使用しています。あなたは、プレーンfunction使用する必要があります。

doSomething: _.throttle(function() { 
     console.log('olas', this.foo); 
    },200)