VueJS - How to detect Ctrl+V?

javascript vue.js vuejs2 textinput
ITWitch picture ITWitch · Mar 10, 2017 · Viewed 12.2k times · Source

I've already seen the answers to this question, but it's not the solution I need, since it's for jQuery, and I need something for vue.js.

So far, I was able to detect single character presses using the ff. code:

The code above successfully prevents the textbox from accepting ArrowLeft, Home, and Control key presses.

The problem:

I'm trying to figure out how to detect Ctrl+V, because I want to prevent paste action in my text box. Does anyone know how to do this? Thanks in advance.

Answer

Saurabh picture Saurabh · Mar 10, 2017

To detect two keys, Vue provides modifier keys, For example to detect Alt+C, you can simply do:

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

Similarly for Ctrl+V, you can do:

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

As I can see here, ASCII code for Ctrl+v is 22, so you should be simply able to do :

<input @keyup.22="YourFn">

Related questions

How to listen for 'props' changes

In the VueJs 2.0 docs I can't find any hooks that would listen on props changes. Does VueJs have such hooks like onPropsUpdated() or similar? Update As @wostex suggested, I tried to watch my property but nothing changed. Then I realized …

Read More
vue.js 2 how to watch store values from vuex

I am using vuex and vuejs 2 together. I am new to vuex, I want to watch a store variable change. I want to add the watch function in my vue component This is what I have so far: import Vue …

Read More
How to add external JS scripts to VueJS Components

I've to use two external scripts for the payment gateways. Right now both are put in the index.html file. However, I don't want to load these files at the beginning itself. The payment gateway is needed only in when …

Read More