Question

为了让内容窃贼生活困难，我想在vue.js组件上禁用渲染文本的复制粘贴。

以下是一个示例模板：

<template>
  <div id="my-precious-content">
    <div class="container"> 
      <div> Some {{texts}} come here </div>
      <div> Still {{moreTexts}} here </div>
    </div>
  </div>
</template>

我想知道如何实现这一目标？

Answer 1

道德观点：你不应该。它打破了普通用户的用户体验。他们无法复制东西以将其翻译成另一种语言，无法复制链接等等。

简短回答：你不能。

答案很长：你可以让它变得更难，但它们仍然可以复制它（除非你把它转换为图像）。防止复制的最简单方法是阻止选择文本，你可以使用css这样做：

.container {
    -webkit-user-select: none;  
    -moz-user-select: none;  
    -ms-user-select: none;  
    -o-user-select: none;  
    user-select: none;
}

另一种方法 您可以使用oncopy event，但它不是标准的，也不会被mdn网络文档用于制作，因此我坚持使用css解决方案。

如何防止在vue.js中复制粘贴

1 个答案: