VUEJS-如何检测Ctrl V

Question

我已经看到了这个问题的答案，但这不是我需要的解决方案，因为它适用于 jquery ，并且我需要一些 vue.js 。

到目前为止，我能够使用FF检测单个字符。代码：

export default {
  name: 'game',
  data () {
    return {
      allowInput: false,
      disabledKeys: ['ArrowLeft', 'Home', 'Control']
    }
  },
  methods: {
    keymonitor: function (event) {
      console.log(event.key)
      
      if (this.disabledKeys.indexOf(event.key) >= 0) {
        event.preventDefault()
        this.allowInput = false
        // alert('not allowed')
      } else {
        this.allowInput = true
      }
    },
    checkAnswer () {
      if (! this.allowInput) {
        alert('the key(s) you pressed is/are not allowed')
      }
    } /* END checkAnswer */
  } /* END methods */
} /* END export default */

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.2.2/vue.min.js"></script>
<input id="typeBox" ref="typeBox" autocomplete="off" placeholder="Type here..."
       @keydown="keymonitor" @keyup="checkAnswer()" />

上面的代码成功阻止了文本框接受 arrowleft ， home 和 control 键按。

问题：

我正在尝试弄清楚如何检测 ctrl v ，因为我想在文本框中防止粘贴动作。有谁知道如何做到这一点？预先感谢。

Answer 1

要检测两个键，VUE提供了修饰符键，例如用于检测 alt c ，您可以简单地做：

<input @keyup.alt.67="YourFn">

类似地， ctrl v ，您可以做：

<input @keyup.ctrl.76="YourFn">

正如我在这里看到的， ctrl v 的ASCII代码为22，因此您应该可以简单地做：

<input @keyup.22="YourFn">

Answer 2

您可以检查相同的JS小提琴链接

keyup: function(event){
    if(event.keyCode == 86 && event.ctrlKey){
    // do something here
  }
}

https://jsfiddle.net/neelkansara28/wh61rby8/16/

Answer 3

我在这里参加聚会有点晚，但是对于任何一个同样的问题来这里的人来说，实际上不需要任何没有内置在Vue本身中的东西。如果您不想阅读所有这些

这是一个带有工作示例的沙箱，可以使用

正如所接受的答案所述，Vue有自己的活动听众，如下所示

它也不需要键代码，特别是工作。因此，就您而言，它将接受字母v

以下是Vuetify组件的一个示例（尽管这几乎可以与任何元素一起使用）：

<v-text-field
   v-model="textField"
   @keydown.prevent.ctrl.v=""
   @keydown.prevent.meta.v=""
   @click.prevent.right.exact=""
/>

这是您在那里看到的@stuff的分解：

• 防止键组合，例如ctrl/cmd v：

  • 对于组合，为了使其正常工作，您必须收听keydown而不是替代方案
  • 要考虑Windows，您需要使用@keydown.prevent.ctrl.v=""
  • 要考虑Mac，您需要使用@keydown.prevent.meta.v=""
  • @keydown聆听键盘事件
  • .prevent自动应用event.preventDefault()
  • .ctrl/.meta是您正在听的修改器键
    • meta密钥是Mac上的CMD密钥，Windows上的Windows密钥
    上的键
  • v当然是我们正在听的另一个键
  • 空的""只是意味着我们没有给它一个运行的函数。如果您想做其他任何事情，则只需在此处引用函数。喜欢：@keydown.prevent.meta.v="doSomethingElse"

• 如果您也想防止右键单击（上下文）菜单： @click.prevent.right.exact=""

  • @click将收听点击事件。
  • .right是只单击右键单击
  的修饰符
  • .exact确保没有接受其他修饰符。没有这个，有人可以按shift right-click，并且上下文菜单将像正常情况一样出现。在这种情况下，.exact确保我们在任何版本的right-click
  上做某事