질문은 충분히 명확해야합니다 :). 그러나 누군가가 다음을 사용하는 것을 볼 수 있습니다.
<button @click="function()">press</button>
누군가 사용 :
<button v-on:click="function()">press</button>
그러나 실제로 둘 사이의 차이점은 무엇입니까?
답변
둘 사이에는 차이가 없습니다. 하나는 두 번째 줄임말입니다.
v- 접두사는 템플릿에서 Vue 관련 속성을 식별하기위한 시각적 신호 역할을합니다. 이것은 Vue.js를 사용하여 기존 마크 업에 동적 동작을 적용 할 때 유용하지만 자주 사용되는 지시문에 대해서는 자세하게 느낄 수 있습니다. 동시에 Vue.js가 모든 템플릿을 관리하는 SPA를 구축 할 때 v- 접두사의 필요성이 덜 중요해집니다.
<!-- full syntax -->
<a v-on:click="doSomething"></a>
<!-- shorthand -->
<a @click="doSomething"></a>
출처 : 공식 문서 .
답변
v-bind
및 v-on
vuejs HTML 템플릿이 개 자주 사용하는 지침입니다. 그래서 그들은 다음과 같이 둘 다에 대한 속기 표기법을 제공했습니다.
당신은 대체 할 수 v-on:
와 함께@
v-on:click='someFunction'
같이:
@click='someFunction'
다른 예시:
v-on:keyup='someKeyUpFunction'
같이:
@keyup='someKeyUpFunction'
마찬가지로, v-bind
와:
v-bind:href='var1'
다음과 같이 쓸 수 있습니다 :
:href='var1'
그것이 도움이되기를 바랍니다!
답변
일반적인 HTML과 약간 다르게 보일 수 있지만 : 및 @는 속성 이름에 유효한 문자이며 모든 Vue.js 지원 브라우저에서 올바르게 구문 분석 할 수 있습니다. 또한 최종 렌더링 된 마크 업에는 나타나지 않습니다. 속기 구문은 전적으로 선택 사항이지만 나중에 사용법에 대해 자세히 알아볼 때 유용 할 것입니다.
출처 : 공식 문서 .