在vue項(xiàng)目中禁止復(fù)制其實(shí)很簡單,只需要加入以下代碼既可:
一床玻、js的方法犯戏,在生命周期函數(shù)中添加:
在vue 2.x中:
<template>
<div>
test
</div>
</template>
<script>
export default {
mounted() {
// 禁用復(fù)制
this.$nextTick(() => {
document.onselectstart = new Function("event.returnValue=false");
})
},
}
</script>
在vue 3.0中:
<template>
<div>
test 2
</div>
</template>
<script setup>
import { onMounted } from 'vue';
onMounted(() => {
// 禁用復(fù)制
document.onselectstart = new Function("event.returnValue=false");
})
</script>
<style scoped>
</style>
二、添加全局css(也可以添加在單個(gè)頁面):
//全局選擇
*{
user-select:none;
}
//或者部分標(biāo)簽
.test-class{
user-select:none;
}