수

vuejs 폼 입력 바인딩

· 2019-02-12 (화) 23:41:40 · 3213

폼 입력 바인딩


기본 사용법


v-model 디렉티브를 사용하여 폼 input과 textarea 엘리먼트에 양방향 데이터 바인딩을 생성할 수 있습니다. 입력 유형에 따라 엘리먼트를 업데이트 하는 올바른 방법을 자동으로 선택합니다. 약간 이상하지만 v-model은 기본적으로 사용자 입력 이벤트에 대한 데이터를 업데이트하는 “syntax sugar”이며 일부 경우에 특별한 주의를 해야합니다.


v-model은 모든 form 엘리먼트의 초기 value와 checked 그리고 selected 속성을 무시합니다. 항상 Vue 인스턴스 데이터를 원본 소스로 취급합니다. 컴포넌트의 data 옵션 안에 있는 JavaScript에서 초기값을 선언해야합니다.

IME (중국어, 일본어, 한국어 등)가 필요한 언어의 경우 IME 중 v-model이 업데이트 되지 않습니다. 이러한 업데이트를 처리하려면 input 이벤트를 대신 사용하십시오.

 

문자열
<input v-model="message" placeholder="여기를 수정해보세요">
<p>메시지: {{ message }}</p>

댓글을 작성하시려면 로그인이 필요합니다.

퍼블리셔팁

1,282건

퍼블리싱과 관련된 유용한 정보를 공유하세요. 질문은 상단의 QA에서 해주시기 바랍니다.

+
분류 제목 글쓴이 날짜 조회
CSS 22-05-09 조회 1,880
CSS 22-04-29 조회 2,220
CSS 22-04-28 조회 2,584
CSS 22-03-14 조회 2,107
기타 21-12-23 조회 3,074
반응형 21-12-06 조회 3,649
웹접근성 21-12-06 조회 3,100
CSS 21-08-10 조회 5,572
기타 21-06-24 조회 9,423
CSS 21-06-16 조회 3,771
웹접근성 20-12-08 조회 4,276
CSS 20-09-16 조회 4,735
기타 20-09-10 조회 3,914
CSS 20-08-04 조회 4,148
기타 20-08-03 조회 3,660
기타 20-03-23 조회 3,419
CSS 20-01-14 조회 4,297
HTML 20-01-14 조회 4,912
기타 19-09-26 조회 8,478
웹접근성 19-05-25 조회 3,594
기타 19-03-26 조회 3,508
기타 19-03-17 조회 4,870
기타 19-02-20 조회 4,726
기타 19-02-12 조회 4,677
기타 19-02-12 조회 3,176
기타 19-02-12 조회 3,214
기타 19-02-07 조회 3,061
기타 19-02-07 조회 3,037
기타 19-02-07 조회 3,733
기타 19-02-04 조회 9,946