Here is an element with a @click handler:
<button @click="doSomething">doSomething</button>
Inside this element, how can we programatically change the value of doSomething with doSomethingElse?
Add a comment
|
1 Answer
Store the function that you want as the handler in a variable.
In this example, handler is the click handler for the first button. Clicking the second and third buttons changes the function that handler is set to.
new Vue({
el: '#app',
data() {
return {
handler: this.doSomething,
}
},
methods: {
doSomething() {
console.log('something')
},
doSomethingElse() {
console.log('something else')
}
}
})<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.4.2/vue.min.js"></script>
<div id="app">
<button @click="handler">Fire Click Handler</button>
<button @click="handler = doSomething">Make Handler Do Something</button>
<button @click="handler = doSomethingElse">Make Handler Do Something Else</button>
</div>