[Vue.js] .sync

 

◽ .sync

prop에 대해 양방향 바인딩이 필요한 경우가 있다.

"undate:myPropNm" 같은 패턴이 권장되어 아래와 같이 작성하면 양방향 바인딩을 할 수 있다.

<text-document
  v-bind:title="doc.title"
  v-on:update:title="doc.title = $event"
></text-document>

 

그리고 위와 같은 패턴을 .sync 수식어를 통해 표현하여 줄일 수 있다.

<text-document v-bind:title.sync="doc.title"></text-document>

 

 

 

출처

https://kr.vuejs.org/v2/guide/components-custom-events.html#sync-%EC%88%98%EC%8B%9D%EC%96%B4

 

 

---

개인적으로 공부한 내용을 정리하는 블로그로
잘못된 개념을 게시하지않도록 주의하고 있으나 오류가 있을 수 있습니다.