vue禁止复制的方式
普通网页禁止复制的功能这里不再叙述,自行学习 https://blog.csdn.net/qq_32963841/article/details/84656752
这里简单写一下vue中怎么禁止使用复制
首先,vue和普通的html页面不太一样。vue的生命周期必须加载完才可以操作dom,生命周期这里不再叙述,自行学习,或者也在mounted和created的时候使用this.$nextTick方法,来使方法在dom生成以后再进行操作。
禁止复制可以通过以下方法,首先是禁止选择,然后就是禁止右键功能,
<template>
<section class="p-10">
<div class="app">
<p> 11111111111111111111111111111111111111111 </p>
</div>
</section>
</template>
<script>
export default {
created() {
this.$nextTick(() => {
// 禁用右键
document.oncontextmenu = new Function("event.returnValue=false");
// 禁用选择
document.onselectstart = new Function("event.returnValue=false");
});
}
};
</script>

这样的话,既不能选择到我们的文本内容,又不能右键进行选择,可以基本上防止复制了。
ps: 想获取文本的话,可以通过F12审查元素,或者百度快照,哈哈哈
嗯,就酱~
vue禁止复制的方式的更多相关文章
- javascript禁止复制网页内容,兼容三大浏览器
javascript禁止复制网页内容可以通过以下方式实现:禁止鼠标右键+禁止选中文本. 代码很简单,只需要在head标签的javascript内加入以下两行代码即可. document.onconte ...
- js进阶 9-8 html标签如何实现禁止复制和粘贴
js进阶 9-8 html标签如何实现禁止复制和粘贴 一.总结 一句话总结: 1.在oncopy方法中return false即可阻止在控件中复制内容 2.在onpaste方法中return fal ...
- HTML 禁止复制文字
因为本人平时喜欢看网络小说,但是喜欢看的文通过正经网站或者app都需要收费,让人很是不爽,所以...总之,百度网盘上资源很多.但是问题来了,这些资源肯定不会是作者自己流出的,也不应该是网站或app流出 ...
- 网站内容禁止复制和粘贴、另存为的js代码(转)
1.使右键和复制失效 方法1: 在网页中加入以下代码: 代码如下: <script language="Javascript"> document.oncontextm ...
- js禁止复制页面文字
做项目的时候有客户提出要求,不能用用户浏览他发表的文章时复制他的文章 一种比较简单的方法,禁止用户选中页面的文字和禁止用户右键菜单 document.oncontextmenu = new Funct ...
- [JavaScript] 怎么使用JS禁止复制粘贴
1. 将彻底屏蔽鼠标右键,其实是禁止快捷菜单,因为不光右键可以弹出这个菜单,键盘上空格键右边的windows键也可以激活这个快捷菜单 <table border oncontextmenu=re ...
- 禁止页面复制功能 js禁止复制 禁用页面右键菜单
<body oncontextmenu="return false">禁用网页右键菜单,但是仍然可以使用快捷键复制. js代码禁用复制功能: <script t ...
- JS 禁止右键,禁止复制,禁止粘贴
原文:JS 禁止右键,禁止复制,禁止粘贴 如何用用javascript 禁止右键,禁止复制,禁止粘贴,做站时常会用到这些代码,所以收藏了一下!1. oncontextmenu="window ...
- html实现 页面禁止右键 禁止复制 禁止图片拖动 禁止复制和剪切
众所周知,一般的屏蔽的方法是用JS来编写的脚本,但是也可以直接通过修改网页属性的方法来屏蔽右键 禁止复制. 禁止右键 oncontextmenu="return false" 禁止 ...
随机推荐
- Android开发之用双缓冲技术绘图
双缓冲技术主要用在画图,动画效果上,其原理就是:将资源先载入到缓冲区,然后再将缓冲区整个载入到View上面去. 双缓冲技术可以有效防止闪烁,提高显示质量. DrawView.java: package ...
- Mac 上的终端神器 iTerm2
官方下载地址:http://www.iterm2.com/ 主题下载地址:https://github.com/mbadolato/iTerm2-Color-Schemes 第三方教程推荐:http: ...
- 可以打开QQ,但打不开网页的DNS服务器设置问题
方法二: IE->设置->连接->局域网设置
- Centos7使用LVM扩容磁盘(测试成功)
1.新增加了一块200G大小的磁盘/dev/sdb fdisk -l 2. pvcreate /dev/sdb 3. pvdisplay 查看添加成功的/dev/sdb的大小为200G 4. vgex ...
- Atitit. atiJavaExConverter4js 新的特性
Atitit. atiJavaExConverter4js 新的特性 1.1. V1新特性1 1.2. V2 新特性1 2. Keyword1 3. Catch1 4. Convert n Thro ...
- 【Java】取当前.class文件的编译位置
本文与<[C++]求当前exe的执行路径>(点击打开链接)为姊妹篇.C++在win下生成的执行文件是.exe.Java生成的执行文件是.class然后自己主动扔到Java虚拟机中执行.主要 ...
- Android中makfile的随记
什么是makefile?也许非常多Winodws的程序员都不知道这个东西,由于那些Windows的IDE都为你做了这个工作,但我认为要作一个好的Android底层程序员. makefile还是要懂. ...
- PCB焊接工艺
1. 有铅焊接工艺 240~260℃. 2. BGA焊盘直径为球径80%.
- python升级导致yum命令无法使用的解决
1.报错信息如下: [root@develop bin]# yum [root@develop local]# yum -y install prce There was a problem impo ...
- 个人博客开发之 全局配置文件settings设置
项目源码下载:http://download.vhosts.cn # -*- coding: utf-8 -*- """ Django settings for cpyb ...