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" 禁止 ...
随机推荐
- openstack架构简单介绍J版(更新中)
title : OPENSTACK架构简单介绍 openstack的发展及历史 openstack是什么? OpenStack是一个美国国家航空航天局和Rackspace合作研发的云端运算软件,以A ...
- Idea maven多模块项目有些加载不出来
进入View>Tool Windows>Maven projects区域,添加新的项目识别. 选择要加载项目的pom.xml文件,ok 完成.
- .Net基础——程序集与CIL HttpClient封装方法 .Net Core 编码规范 C#中invoke和beginInvoke的使用 WebServeice 动态代理类
.Net基础——程序集与CIL 1. 程序集和CIL: 程序集是由.NET语言的编译器接受源代码文件产生的输出文件,通常分为 exe和dll两类,其中exe包含Main入口方法可以双击执行,dll ...
- nginx跨域(转2)
当出现403跨域错误的时候 No 'Access-Control-Allow-Origin' header is present on the requested resource,需要给Nginx服 ...
- TCP通过哪些措施,保证传输可靠
TCP是通过什么方式来提供可靠传输的 (合理截断数据包,超时重发,校验,失序重新排序,能够丢弃重复数据,TCP可以进行流量控制) TCP提供一种面向连接的.可靠的字节流服务. 面向连接:意味着两个使 ...
- Android WebView与JavaScript交互实现Web App
当我们去开发一个基于web的android app时,我们第一须要处理的就是与JavaScript的交互问题.Android须要做的事情就是开放某些特定的接口供web里的JavaScript调用,能够 ...
- 没有博士学位,照样玩转TensorFlow深度学习
教程 | 没有博士学位,照样玩转TensorFlow深度学习 机器之心2017-01-24 12:32:22 程序设计 谷歌 操作系统 阅读(362)评论(0) 选自Codelabs 机器之心编译 参 ...
- 【Java集合源代码剖析】Java集合框架
转载轻注明出处:http://blog.csdn.net/ns_code/article/details/35564663 Java集合工具包位于Java.util包下,包括了非常多经常使用的数据结构 ...
- jquery样式表和效果
$("p").css({ "color": "#ff0011", "background": "blue&qu ...
- Unity学习笔记 - Assets, Objects and Serialization
Assets和Objects Asset是存储在硬盘上的文件,保存在Unity项目的Assets文件夹内.比如:纹理贴图.材质和FBX都是Assets.一些Assets以Unity原生格式保存数据,例 ...