javascript - 如何在 vue 中添加事件监听器来记录更改?

标签 javascript vue.js

我可以将监视属性添加到输入表单。但是如果用户按下一个键怎么办?我想当用户在页面上时打印按键。

$(document).keypress(function(event){
            alert(String.fromCharCode(event.which));
        });

但是如何在 vue 中添加按键检查?

最佳答案

注册全局事件监听器有两种选择。


如果您的文档根目录中有另一个 Vue 实例,您可以使用自定义事件。

添加到您的主实例:

<body @keydown="this.$emit('onkeydown')">...</body>

以及您的嵌套实例:

<my-component v-on:onkeydown="alert(String.fromCharCode(event.which));"></my-component>

这会发出一个由嵌套实例捕获的全局事件。如果您想了解更多关于自定义事件的信息,请点击here .


如果 body 元素上没有实例,您可以在创建 Vue 实例时在文档上创建一个事件监听器 ( Example ):

  methods: {
    onkeydown(e) {
      alert(String.fromCharCode(event.which));
    }
  },

  created() {
    document.onkeydown = this.onkeydown;
  }

关于javascript - 如何在 vue 中添加事件监听器来记录更改?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40299919/

相关文章:

javascript - 绑定(bind)单击键和输入键以实现辅助功能

javascript - Symfony 无法从 AngularJS View 获取上传的文件

javascript - 为什么只有一个 JavaScript 函数执行 onClick?

json - Vuejs 和请求 : Computed property function doesnt display GET JSON value

javascript - JavaScript 中具有序列数组输出的斐波那契递归函数

javascript - 将 ng-repeat 与动态创建的类一起使用

vue.js - VueJS Vuetify 如何从单击的表行中触发激活器

javascript - Vue 组件 prop 未定义

javascript - Vue.js 提交文本按钮

vue.js - Vue3 - i18n - 您正在运行 vue-i18n 的 esm-bundler 构建