If you’ve come across the @ and : symbol in Vue and you have forgotten what they mean, then there is an easy way to remember them.
Imagine @ looking similar to an ‘o’ (aka the letter). This letter is contained in v-on. Therefore v-on can be replaced with @. We can also get rid of the colon as well. eg
v-on:click => @click
v-bind is used to set the value of an attribute. Here, The ‘i’ in the word bind looks like the top part of ‘i’. eg
v-bind:href => :href v-bind:input => :input v-bind:value => :value
So whenever you see an ‘i’, think of a colon and just use that. Whenever you see an ‘o’, think of @.