vue.js는 키보드 이벤트를 수신합니다.-JS 튜토리얼-php.cn

Vue는 키보드를 모니터링하고 @를 사용하여 직접 바인딩하며 Vue는 일반적으로 사용되는 여러 키에 대한 별칭을 제공하므로 keyCode

#🎜 🎜#

모든 주요 별칭

.enter

.tab

.delete("삭제" 및 " 후퇴 "격자" 키)

. .down

#🎜 🎜# .left

.right

1 . 입력 레이블을 esc 키에 바인딩합니다. 🎜🎜#

<input type="text" @keyup.esc="KeyUpEsc">

로그인 후 복사

KeyUpEsc:function(){
      alert("监听到esc键")
  }

로그인 후 복사

# 🎜🎜#함수 렌더링

2. 요소 구성 요소 라이브러리의 el-input 태그를 사용하고 삭제를 바인딩합니다. key

#🎜 🎜# 바인딩 이벤트

<el-input v-model="input" placeholder="请输入内容" @keyup.delete.native="KeyUpDelete"></el-input>

로그인 후 복사

이번에는 바인딩 이벤트에 추가 .native 수정자가 있는 이유는 무엇입니까? element-ui는 입력에 div를 캡슐화하기 때문에 라벨 외부에는 원래 이벤트가 숨겨지므로 .native가 추가되지 않으면 키 입력이 적용되지 않습니다