Vue in v-on instruction for binding dom event listener function. The following code implements a Click Change the text color features.
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <script src="https://cdn.staticfile.org/vue/2.2.2/vue.min.js"></script> <title>Vue Test</title> </head> <body> <div id="app"> <p v-on:click="changeColor">Fly me to the Moon.</p> </div> <script> var vApp = new Vue({ el: "#app", methods: { changeColor: function () { this.$el.style.color = "red" } } }) </script> </body> </html>
Note that, the this point to the Vue instance of an object.