vue 粘贴内容至输入框方法
时间: 2023-07-15 20:13:14 浏览: 120
uniapp 基于 vue3 开发的【验证码输入框】
可以使用 `@paste` 事件来监听粘贴事件,然后获取剪贴板中的内容,再将其赋值给输入框的值即可。
例如,在 `input` 标签中添加 `@paste` 事件:
```html
<template>
<div>
<input type="text" v-model="inputValue" @paste="handlePaste">
</div>
</template>
```
然后在 Vue 实例中定义 `handlePaste` 方法,获取剪贴板中的内容,再将其赋值给 `inputValue`:
```javascript
<script>
export default {
data() {
return {
inputValue: ''
}
},
methods: {
handlePaste(event) {
const clipboardData = event.clipboardData || window.clipboardData;
const pastedData = clipboardData.getData('text');
this.inputValue = pastedData;
}
}
}
</script>
```
这样,当用户在输入框中粘贴内容时,就会触发 `handlePaste` 方法,将剪贴板中的内容赋值给输入框的值。
阅读全文