前端
__不靠谱先生
这个作者很懒,什么都没留下…
展开
-
Vue前端添加水印功能(附源码)
前端vue添加水印功能,组件式引入,开箱即用,颜色样式、范围、密度可修改,且有防人为干预删除或修改水印等功能!原创 2023-11-17 15:02:18 · 1432 阅读 · 0 评论 -
纯前端实现3D旋转动态词云
动态词云,纯前端实现3D动态词云原创 2022-07-19 17:44:41 · 2731 阅读 · 0 评论 -
facebook,twitter的分享图片功能,facebook分享图片
前端工作中我们经常会遇到把网页的内容分享到别的社交网站上去,微信,qq,新浪,facebook,twitter等社交中去,这里墙内的分享方法我就不说了,圈内肯定有很多大佬,我给大家分享一个FaceBook,Twitter的图文分享(认真看完相信对你有收获。网上的例子大多包括Facebook官网上的例子是用在页面上创建meta来做分享,但是我用Vue写的前端,测是不行,并不能抓取到页面他们只是把FaceBook官网的例子粘贴下来,具体能不能实现估计作者也不知道,Vue页面只有一个html页面,怎么动态生成数原创 2020-09-01 17:39:03 · 6594 阅读 · 34 评论 -
递归算法通过子节点查找当前节点的父节点。
实际场景为, 你已经获取到某一个确认的子 id ,想找到其上一级,增加一个对象或者删除一个对象。直接干代码var arr = { id: 0, name: '000', children: [ { id: 1, name: "xhh", children: [ { id: 11, n原创 2021-06-18 16:01:50 · 1292 阅读 · 0 评论 -
base64文件导出,转Blob下载。
<!DOCTYPE html><html><head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title></title> <meta charset="utf-8" /></head><body> <script> /**封装blo转载 2021-03-29 09:34:24 · 329 阅读 · 0 评论 -
深浅拷贝的问题
一. vue1. vue的双向绑定原理?vue数据双向绑定是通过数据劫持结合发布者-订阅者模式的方式来实现的,通过Object.defineProperty()来劫持各个属性的setter,getter,在数据变动时发布消息给订阅者,触发相应的监听回调。2....原创 2021-01-08 11:40:05 · 74 阅读 · 0 评论 -
css让图片等比缩放,从中心往两边扩大过渡效果。
//外层容器即可视宽高 <div class="sc"> <img src="" alt /> // 换成自己的图 </div> .sc { height: 300px; width: 400px; overflow: hidden; } img { height: 100%; width: 100%; transition: transfor原创 2020-12-01 10:34:51 · 1560 阅读 · 0 评论 -
前端文件下载,下载流文件
这里给提供一种Blob的方式大致就是URL.createObjectURL() 静态方法会创建一个 DOMString,其中包含一个表示参数中给出的对象的URL**new Blob 就是Blob对象是二进制数据,但它是类似文件对象的二进制数据,因此可以像操作File对象一样操作Blob对象,实际上,File继承自Blob。**// 假设你已经得到了文件类似如图 const data = res; // 后端打回来的流文件 // 第一个参数是流文件 ,第二是格式, 这个在后端会提前声明的原创 2020-10-30 09:47:02 · 796 阅读 · 0 评论 -
解决el-checkbox传值编辑回显问题。
{{city.name}}data() {return {value: [],cities: [{name:‘北京’,id:‘1’}, {name:‘武汉’,id:‘2’},{name:‘深圳’,id:‘3’}];};label是展示在外的text内容.如果el-checkbox标签之间不写任何内容显示也是label的内容,但是我们在el-checkbox标签里面加上{{}}name的值。这个其实就是显示的内容啦。...原创 2020-10-15 14:30:49 · 3686 阅读 · 0 评论 -
chrome中隐藏滚动条
#el::-webkit-scrollbar {display: none;}原创 2020-09-18 16:26:46 · 802 阅读 · 0 评论 -
限制input输入的长度,input的type为number的长度,type=‘number’的maxlength不生效问题
input当为number类型是maxlength不生效,这里有两种方案 一种是把**number**改成**tel** <input type="tel" maxlength="5" /> // 可以生效或者就是 <input type="number" οninput="if(value.length>5) value=value.slice(0,5)" /> // 原生写法附上vue写法 <input placeholder="请输入联系.原创 2020-09-16 14:24:00 · 1809 阅读 · 0 评论 -
vue脚手架中页面使用过滤器
<span v-for='(item,tagsIndex) in scope.row.tags' :key="tagsIndex" @click="searchByTags(item)">{{item + ',' | formDataTags }}</span> filters: { formDataTags(e){ return e; } },原创 2020-09-09 16:24:00 · 484 阅读 · 1 评论 -
小程序的input绑定值的问题.
小程序的input的数据不是双向绑定的,所以需要我们手动添加监听事件<input type="text" value="{{username}}" placeholder='名称' class='username' bindinput="updateValue" data-value="{{username}}"/>bindinput=“updateValue”然后 在data里面自定义我们需要的值username updateValue(e){ console.l原创 2020-08-13 18:10:52 · 1981 阅读 · 0 评论 -
Vue数据和视图不同步的原因
vue中在data中的对象赋予新的属性是不能响应式的更新数据的。在这里插入代码片 var vm = new Vue({ el: '#app', data: { tempArr: [ { name: "Tom", age: "11" }, { name: "Marry", age: "21" }, {原创 2020-07-15 14:08:37 · 2271 阅读 · 1 评论 -
vue动态绑定绑定多个类名。
:class="[‘text-uppercase text-center’,{‘category-active’:categoryFlag }]"原创 2020-07-03 10:29:41 · 2020 阅读 · 0 评论 -
前端防止过多请求的两种办法,标志变量和防抖节流,。
我们请求数据的时候特定的情况下有时候会发生请求很多次数据的情况,或者对恶意请求数据的攻击作出相对处理,这有两种办法解决。第一种就是很简单的办法设置标变量 (vue写法,纯js的写成局部变量即可)data(){ return{ flag:true // 设置为true第一次请求允许进来 }}// 这种方法就是让第一次请求进来后把标志变量设为false,然后在没有得到数据之前是不能再次进去请求接口的。getList(){ if(this.flag==false){原创 2020-06-22 15:29:46 · 1068 阅读 · 0 评论 -
监听路由两种方式
监听 路由的to和from。router.beforeEach(){//操作}'$route' (to, from) { this.$router.go(0); console.log(to) console.log(from)}原创 2020-06-17 14:36:17 · 5525 阅读 · 0 评论 -
jq使用ajax请求数据并获取地址栏参数
ajax请求var baseUrl = “http:localhost:8080”var params = getUrlParam("你要获取的参数");```javascript $.ajax({ url: baseURL + "/wpindex/create/poster" + "?postId=" + postId, async: false, // data: { postId: postId }, success: fun原创 2020-06-13 11:31:47 · 1098 阅读 · 0 评论 -
自定义显示几行,超出显示...
text-overflow: -o-ellipsis-lastline; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; line-clamp: 3;另外一种需求就是固定长度,超出显示…{overflow: hidden;white-space: nowrap;text-overfl..原创 2020-06-12 15:23:56 · 136 阅读 · 0 评论 -
一个接口发送两个请求问题
虽然知道请求种类有 HEAD、GET、PUT、POST、DELETE、OPTIONS等,但是基本上用到的大多都是GET、PUT、POST、DELETE。前几天查看network请求时意外发现本地环境跑公司项目的时候,每次POST之前,都偷偷给我来一次没有返回的OPTIONS请求。询问了大佬、查了资料。原来在 CORS-跨域资源共享 中,可以使用 OPTIONS 方法发起一个预检请求,以检测实际请求是否可以被服务器所接受。预检请求报文中的 Access-Control-Request-Method 首部字段原创 2020-06-05 13:31:34 · 1121 阅读 · 0 评论 -
返回上一层
document.referrer源页面信息 var refer = document.referrer; if(refer != ""){ history.back(); }原创 2020-04-10 21:42:31 · 365 阅读 · 0 评论 -
axios请求前在header头里面添加token(“可作为用户的唯一标识”)
路由拦截在header头添加access_token,每次发送请求就会先获取session里面存的值,有的话就带着,没有就不带。// 请求拦截器中统一的修改config.headersaxios.interceptors.request.use(function (config) {// console.log(‘config’, config)let token = sessionSto...原创 2020-01-09 20:06:34 · 3826 阅读 · 0 评论 -
Electron打包exe文件,node打包
Electron打包exe文件前几天看了一篇文章,Electron打包exe文件,看评论下面很多小伙伴不理解,所以这里我自己根据自己写的小demo给大家示范一下,不喜勿喷。认真的看完这篇文章你可能就能得到不小的收获。开始首先准备好要打包的文件这里没有准备太多文件很简单,效果就是在 demo1 可以跳转到demo2demo2.htmldemo1.htmlindex.jscon...原创 2019-09-25 16:14:01 · 1238 阅读 · 1 评论