Vue:Template
lastmod 2020-10-15created 2020-10-152 edits
v-bind shorthand
<!-- 전체 문법 -->
<a v-bind:href="url"> ... </a>
<!-- 약어 -->
<a :href="url"> ... </a>
<!-- shorthand with dynamic argument (2.6.0+) -->
<a :[key]="url"> ... </a>
v-on shorthand
<!-- 전체 문법 -->
<a v-on:click="doSomething"> ... </a>
<!-- 약어 -->
<a @click="doSomething"> ... </a>
<!-- shorthand with dynamic argument (2.6.0+) -->
<a @[event]="doSomething"> ... </a>
These may look a bit different from normal HTML. However, : and @ are valid characters for attribute names, and all browsers supported by Vue.js can parse them correctly. They also do not appear in the final rendered markup. The shorthand syntax is entirely optional, but you will likely find it convenient once you get used to it.