I'm currently in the process of developing a custom rendered component that will execute a function when clicked on:
// Creating a standard Vue component with a render function
Vue.component('greeting', {
methods: {
sayHello(){
alert('hello')
}
},
render(createElement){
var self = this
return createElement(
'button',
{
'@click': self.sayHello
},
'Click here to hear me say hello')
}
})
new Vue({
el: '#app'
})
I am anticipating an alert message upon clicking the button. However, the rendered result is likely to be something along the lines of
<button @click="sayHello" />
with the sayHello method defined within the Vue instance.
What could possibly be causing this functionality issue?