Vue.js 学习笔记 十 自定义按键事件

<div id="divApp">
        <!--任何键盘动作都会触发-->
        <input type="text" v-on:keyup="show" />
        <!--回车触发-->
        <!--Vue给我们定义了enter，tab，delete删除和退格，esc，space,up,down,left,right事件-->
        <input type="text" v-on:keyup.enter="show('我是入参')" />
        <!--F2触发，113是F2对应的键盘码-->
        <input type="text" v-on:keyup.113="show" />
    </div>

    <script>
        var v = new Vue({
            el: '#divApp',
            data: {
            },
            methods: {
                show(param) {
                    alert("自定义按键" + param.padStart(10,'abc'));
                }
            }
        })

    </script>

出了按键事件，这里还用了个字符串的padStart方法，第一个参数10，是最小长度，第二个参数abc,是不够最小长度的话，用abc填充在字符串前面，对应的还有padEnd，是在后面填充。

其实按键事件用到的情况不多，但是有备无患。

上一篇

Vue.js 学习笔记 九 v-if和v-show