なぜvueのメソッドが機能しないのですか？

Question

私はvueのメソッドを書こうとしていますが、なぜ 'clickA'は動作しませんが、 'clickB'は実行可能ですか？

注：解決策は、throttleの機能を 'clickB'のように機能させる必要があります。

new Vue({ 
 
    el: '#app', 
 
    methods: { 
 
    clickA: function() { 
 
     _.throttle(function() { 
 
     var date = new Date(); 
 
     var time = date.toLocaleTimeString(); 
 
     console.log('A clicked', time) 
 
     }, 1000) 
 
    }, 
 
    clickB: _.throttle(function() { 
 
     var date = new Date(); 
 
     var time = date.toLocaleTimeString(); 
 
     console.log('B clicked', time) 
 
    }, 1000) 
 
    } 
 
});

<script src="https://unpkg.com/vue@2.5.10/dist/vue.min.js"></script> 
 
<script src="https://unpkg.com/lodash@4.17.4/lodash.min.js"></script> 
 
<div id="app"> 
 
    <button type="button" @click="clickA">A</button> 
 
    <button type="button" @click="clickB">B</button> 
 
</div>

Answer 1

_.throttle戻り新機能。これについて考えると、あなたの頭を包み込むのはちょっと難しいかもしれませんが、意味があります！

clickBは、_.throttleが返す関数にバインドされています。

ただし、clickAでは、_.throttleが作成する機能にクリックアクションをバインドしていません。

Answer 2

_.throttleは、抑制機能を返します。

ですから、新しい関数を定義することができます

var slowThing = _.throttle(fastThing)

それとも、財産としての機能を定義することができます。

object: { 
    slowThing: _.throttle(fastThing) 
} 

しかし、上記clickAで、スロットル機能がないですが割り当て：

slowThing: function() { 
    // this creates a new function but doesn't execute it 
    _.throttle(fastThing) 
}