I'm attempting to create a Vue method, and I've encountered an issue where 'clickA' does not function, but 'clickB' does. Can someone explain why this is happening?
It's important that the solution allows the throttle function to work in the same way as '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/<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="8ef8fbebcebca0bba0bfbe">[email protected]</a>/dist/vue.min.js"></script>
<script src="https://unpkg.com/<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="2f43404b4e5c476f1b011e18011b">[email protected]</a>/lodash.min.js"></script>
<div id="app">
<button type="button" @click="clickA">A</button>
<button type="button" @click="clickB">B</button>
</div>