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" 禁止 ...
随机推荐
- java之方法的重写
方法的重写: 1.在子类中可以根据需要对从基类中继承来的方法进行重写. 2.重写的方法和被重写的方法必须具有相同方法名称.参数列表和返回类型. 3.重写方法不能使用比被重写的方法更严格的访问权限. 程 ...
- Python 的基本运算和内置函数
一.运算符 (一)Python算术运算符 以下假设变量: a=10,b=20: 运算符 描述 实例 + 加 - 两个对象相加 a + b 输出结果 30 - 减 - 得到负数或是一个数减去另一个数 a ...
- Python解微分方程
1.求解常微分方程的步骤: from sympy import * init_printing() #定义符号常量x 与 f(x) g(x).这里的f g还可以用其他字母替换,用于表示函数 x = S ...
- vue 结合localStorage 来双向绑定数据
结合localStorage 来双向绑定数据(超级神奇) localStorage.js: const STORAGE_KEY = 'todos_vuejs' export default { fet ...
- CentOS7下利用init.d启动脚本实现tomcat开机自启动
在之前的博文中已经对CentOS7下通过tomcat进行WEB系统的发布进行了介绍,今天将利用init.d启动脚本,将服务脚本加入到开机启动服务队列,实现tomcat服务的开机启动. 1. 环境准备 ...
- Atitit.数据库存储引擎的原理与attilax 总结
Atitit.数据库存储引擎的原理与attilax 总结 1. 存储引擎是什么1 2. 其它数据库系统(包括大多数商业选择)仅支持一种类型的数据存储2 3. 表的存储有三个文件:结构+数据+索引2 4 ...
- 设计模式之里氏替换原则(LSP)
在java等面向对象编程语言里面,我想继承性应该是一大特色吧!所以今天所要讲解的里氏替换原则主要是针对这一特性而提出来的,当我们定义对象的时候,尽量找出对象之间的相同点,然后将其抽象成基类对象.比如水 ...
- C# Type.GetConstructor() 根据构造函数参数获取实例对象(一)
using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.T ...
- linux学习之缓存机制
linux中的缓存机制 在Linux系统中,为了提高文件系统性能,内核利用一部分物理内存分配出缓冲区,用于缓存系统操作和数据文件,当内核收到读写的请求时,内核先去缓存区找是否有请求的数据,有就直接返回 ...
- iOS 集成微信支付【转载】
目前项目里有微信支付的需求,调研过一段时间后,发现其实并没有想象中的那么困难.如果你只是想实现该功能,一个方法足以,但是若你想深入了解实现原理.就需要花费更多的功夫了.目前我只清楚微信支付需要做签名, ...