VueJS - 如何检测Ctrl + V?

ITW*_*tch 3 javascript textinput vue.js vuejs2

我已经看到了这个问题的答案,但这不是我需要的解决方案,因为它适用于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 */
Run Code Online (Sandbox Code Playgroud)
<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()" />
Run Code Online (Sandbox Code Playgroud)

上面的代码成功地防止文本框从接受ArrowLeft,HomeControl按键.

问题:

我正在试图找出如何检测Ctrl+ V,因为我想在我的文本框中阻止粘贴操作.有谁知道如何做到这一点?提前致谢.

Sau*_*abh 14

要检测两个键,Vue提供修饰键,例如要检测Alt+ C,您可以简单地执行:

<input @keyup.alt.67="YourFn">
Run Code Online (Sandbox Code Playgroud)

同样对于Ctrl+ V,您可以这样做:

<input @keyup.ctrl.76="YourFn">
Run Code Online (Sandbox Code Playgroud)

正如我在这里看到的,Ctrl+的ASCII代码v是22,所以你应该能够做到:

<input @keyup.22="YourFn">
Run Code Online (Sandbox Code Playgroud)

  • 尽管我很喜欢这个答案,但有一个[注意](https://vuejs.org/v2/guide/events.html#Modifier-Keys)说:...keyup.ctrl只会在您释放按住 Ctrl 键的同时按 键。如果单独释放 ctrl 键,则不会触发。 (2认同)