Study/Vue.js
[Vue.js] TextBox에서 Enter 키를 눌렀을때 조회 버튼 클릭과 동일한 동작이 실행되도록 처리하는 방법
kmhan
2020. 9. 29. 22:05
728x90
반응형
Enter키를 눌렀을때 버튼 클릭과 동일한 동작이 실행되도록 처리하는 방법입니다.
| <!DOCTYPE html> ... <body> <div id="app> <button v-on:click="logText">조회</button> <input type="text" v-on:keyup.enter="logText"> </div> <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> <script> new Vue({ el: '#app', methods: { logText: function() { console.log('clicked'); } } }) </script> </body> </html> |
| 설명 : 조회버튼에 클릭이벤트에서 logText 메서드를 호출하도록 했는데, TextBox에서 엔터키 이벤트도 logText 메서드를 호출하도록 함으로써 원하는 동작이 가능하다. |
출처 : Vue.js 시작하기 - Age of Vue.js
728x90
반응형