vue.js组件数据绑定
v热键 (v-hotkey)
Vue 2.x directive for binding hotkeys to components.
Vue 2.x指令,用于将热键绑定到组件。
安装 (Install)
$ npm i --save v-hotkey
用法 (Usage)
import Vue from 'vue'
import VueHotkey from 'v-hotkey'
Vue.use(VueHotkey)
<template>
<span v-hotkey="keymap" v-show="show"> Press `ctrl + esc` to toggle me! Hold `enter` to hide me! </span>
</template>
<script>
export default {
data () {
return {
show: true
}
},
methods: {
toggle () {
this.show = !this.show
},
show () {
this.show = true
},
hide () {
this.show = false
}
},
computed: {
keymap () {
return {
// 'esc+ctrl' is OK.
'ctrl+esc': this.toggle,
'enter': {
keydown: this.hide,
keyup: this.show
}
}
}
}
}
</script>
事件处理程序 (Event Handler)
keydown (as default)
按键(默认)
keyup
键控
按键组合 (Key Combination)
Use one or more of following keys to fire your hotkeys.
使用以下一个或多个键来触发您的热键。
ctrl
ctrl
alt
alt
shift
转移
meta (windows / command)
元(Windows /命令)
翻译自: https://vuejsexamples.com/vue-2-x-directive-for-binding-hotkeys-to-components/
vue.js组件数据绑定