- 博客(44)
- 收藏
- 关注
原创 web应用增加水印
思路是直接在body下加一个div 在div内循环span 添加水印内容。让当前这个div 处于 index最高层。会出现一个问题 最高层的div会遮盖主页面导致 页面上的操作失效。解决这个问题可以使用css的 pointer-events: none;属性,禁止掉div的所有事件。当前在做的项目 客户那边有需求需要增加水印,防止员工通过截图或者录屏泄露敏感信息。搜了一下实现web应用水印的方案大致分为几类,1.使用背景图片 repeat。2.使用canvas绘制。
2024-05-21 17:14:27
215
翻译 提问的智慧
在黑客的世界里,当你拋出一个技术问题时,最终是否能得到有用的回答,往往取决于你所提问和追问的方式。本指南将教你如何正确地提问以获得你满意的答案。现在开源(Open Source)软件已经相当盛行,您通常可以从其他更有经验的用户那里获得与黑客一样好的答案,这是件好事;和黑客相比,用户们往往对那些新手常遇到的问题更宽容一些。尽管如此,以我们在此推荐的方式对待这些有经验的用户通常也是从他们那里获得有用答案的最有效方式。首先你应该明白,黑客们喜爱有挑战性的问题,或者能激发他们思维的好问题。
2024-04-02 14:58:03
37
原创 vue核心问题
1.vue设计理念渐进式渐进式javascript框架,Vue被设计为可以自底向上逐层应用。vue不强求你一次性接受并使用他的全部功能。易用vue提供数据响应式、声明式模板语法和基于配置的组件系统等核心特性。这些使我们只需关注应用的核心业务即可,只会 js html 和 css 就可以轻松上手。灵活不断繁荣的生态系统,可以在一个库和一个完整的框架之间自如伸缩。引入 vue-router vuex,各种插件等等。高效超快的虚拟dom和diff 最省心的优化。vue3使用的p
2024-03-29 16:08:26
562
1
原创 基于vue element-UI 的 virtual-tree (虚拟树)
使用 @femessage/element-ui 插件 详情1.安装npm i @femessage/element-ui -S2.引入import { Tree as virtualTree } from '@femessage/element-ui'Vue.component('virtualTree', virtualTree)3.使用注:1.虚拟滚动必须固定height2.element-ui 的树搜索依赖dom。所以虚拟滚动会对搜索有影响。自定义搜索方法 &
2022-04-18 13:54:55
4503
4
原创 vue项目下载前端项目内的文件
<a href="/static/user_demo.xlsx" download="前端本地导出样例.xlsx">下载excal</a>文件存存放目录
2022-01-26 13:38:44
1121
原创 通过自定义指令实现 element-ui的tooltip组件 文本长度超出显示不超出不显示
通过自定义指令实现 element-ui的tooltip组件 文本长度超出显示不超出不显示
2022-01-26 13:30:47
3907
2
原创 清除vue的keep-alive的页面内指定页面的缓存
1.需求背景自定义页面的tab 类似chrome浏览器的标签页页,如图切换要求为1、打开的页面切换要保留页面上的数据如:页面的搜索条件选项和表格数据等。2、关闭页面再打开时需要重新加载页面。2.出现问题使用keep-alive 缓存子页面,确实可以达到 需求 1 的要求,但是关闭了这个页面在打开的话页面缓存依然存在。3.解决方案1.查找了keep-alive的清除缓存的方案,发现官方并没有提供相关方法。所以先想到的是,重新打开页面链接后面增加一个随机数的参数。但是需要区.
2021-09-14 13:30:25
1435
2
转载 小程序静默登录方案设计
https://mp.weixin.qq.com/s?__biz=MzAxODE2MjM1MA==&mid=2651576237&idx=2&sn=2c27e57b7f02d028203590552317d9f9&chksm=8025006cb752897a353c7075051d0191c1b350d960eb7ebda36bfd94237ab1d926a420355e48&scene=21#wechat_redirect
2021-05-28 09:24:46
153
原创 通过CSS的sticky属性 重新回顾 position
前言:依稀记得刚学习前端找工作问过我一个面试题,css的position的属性有几种,我回答的是absolute 生成绝对定位的元素,相对于 static 定位以外的第一个父元素进行定位。 元素的位置通过 "left", "top", "right" 以及 "bottom" 属性进行规定。 fixed 生成绝对定位的元素,相对于浏览器窗口进行定位。 元素的位置通过 "left", "top", "right" 以及 "bottom" 属性进行规定。
2021-04-22 16:27:07
179
原创 小程序云函数解析encryptedData
1.准备工作创建小程序,开启云开发不做赘述参考这里。获取手机号参考这里注意:获取手机号必须企业认证 && 微信认证 (300元/年) 才能使用2.直接上代码云函数 getPhone// 云函数入口文件const cloud = require('wx-server-sdk')cloud.init({ env: cloud.DYNAMIC_CURRENT_ENV})// 云函数入口函数exports.main = async (event, con.
2021-04-09 16:26:35
411
转载 技术人具备“结构化思维”意味着什么?
技术人具备“结构化思维”意味着什么?导读:在日常工作中,我们时常会碰到这样的情况,有的人讲事情逻辑非常混乱,罗列了很多事项,却把握不到重点,无法把一件事情说清楚。这种思维混乱是典型的缺少结构化思维的表现。结构化思维非常重要,不仅仅体现在表达上,也体现在在我们分析问题的过程中。具备结构化思维,才能将问题分析地更全面、更深刻。什么是结构化思维?那么到底是什么是结构化思维呢?简单来说,结构化思维的定义就是:逻辑+套路。表达要有逻辑**所谓逻辑是指我们的结构之间必须是有逻辑关系的。**例如,你说话的时候用
2021-02-24 15:58:22
156
原创 :nth-child、:nth-of-type 、:first-child与:first-of-type这四者异同?
<body> <div> <p>大儿子</p> <div>二儿子</div> <p>三儿子</p> </div> <p>二叔</p> <div>三叔<div></body>div:nth-child(2) 选中父元素里的第二个子元素div;(即二儿子被选中.
2021-02-20 09:09:51
211
1
原创 js代码简写小技巧
分享一些我常用的代码优化技巧1. 多表达式多 if 判断我们可以在数组中存储多个值,并且可以使用数组include方法。// 长if (x === 'abc' || x === 'def' || x === 'ghi' || x ==='jkl') { //logic}// 短if (['abc', 'def', 'ghi', 'jkl'].includes(x)) { //logic}2. 简写 if else如果 if-else 的逻辑比较降低,可以使用下面这种方式镜像简..
2021-02-05 09:15:25
285
1
原创 ES6之Set,Map的区别
简述:Set 和 Map 主要的应用场景在于 数据重组 和 数据储存。Set 是一种叫做集合的数据结构,Map 是一种叫做字典的数据结构。集合 与 字典 的区别:共同点:集合、字典 可以储存不重复的值不同点:集合 是以 [value, value]的形式储存元素,字典 是以 [key, value] 的形式储存集合(Set):ES6 新增的一种新的数据结构,类似于数组,但成员是唯一且无序的,没有重复的值。Set 本身是一种构造函数,用来生成 Set 数据结构。Set 对象允许你储存
2021-02-01 10:02:22
2173
转载 一次关于Vue的自我模拟面试
前言昨晚做了一个梦,梦见自己到了一家大厂面试,面试官走近房间,坐了下来:是杨溜溜吧?国际惯例,先来个自我介绍吧。于是我巴拉巴拉开始了长达两分钟的自我介绍,与此同时,面试官边听边看我的简历,边看边皱眉,结束后问:看你之前的项目经常用到Vue,对Vue熟悉吗?我嘴角一笑,心里暗喜:幸好有专门看Vue的面试题,看来这次稳了。于是谦虚又装逼的回答:还行吧,您随便问。于是面试官看我口气那么大,心想:哟嚯,来了一个装逼的,劳资今天就只问Vue。来,先介绍一下Vue的响应式系统Vue为MVVM框架,当数据模型
2021-01-25 09:31:19
327
转载 RESTful是什么
1 什么是 RESTful百度一下 RESTful,查到的资料很多都讲得不清楚,看完了都不知道说的是啥,导致很多人对 RESTful 不甚了解。来看一下常见的解释:(1)神一样的描述REST 并不是“休息”的意思,而是 Representational State Transfer 的简称,即 表现层状态转移。“表现层状态转移”是什么鬼?(2)云里雾里的描述REST 指的是 一组架构约束条件和原则,如果一个架构符合 REST 的约束条件和原则,就称之为 RESTful 架构。RESTful
2021-01-19 19:23:35
1417
原创 面试题2
1、3.0为什么升级到4.0?升级4.0前端做了哪些升级? (1)功能升级 (多人标注,仲裁,流转,积分公式配置,多个平台的合并,单点登录) (2)技术升级 (java路由=>vue-router ,权限控制=> vue-router的beforeEach 来判断,jq 升级成vue , 前端部署 )2、怎么兼容3.0和4.0双平台的?灰度发布怎么做的? (1) 逐步迭代 (同一个访问地址 nginx 代理到两个项目,管理中心3.0 用户中心4.0)3、怎...
2021-01-17 14:36:40
117
原创 面试题1
**vuejs**1. vue数据双向绑定原理, 1. 在beforecreate 和 created 之间 递归data 使用object.defineprototype 监听属性,设置 get 和 set ,set的时候通知视图改变(订阅-发布模式) get的时候订阅 set的时候发布 一对多 2. 给 input textarea 绑定input事件,val改变是改变data的值 2. nextTick具体是怎么实现的 1. 下一次视图更新时触发 2. promis...
2021-01-17 14:36:13
105
原创 js 数组实用函数
1.mapmap() 方法返回一个新数组,数组中的元素为原始数组元素调用函数处理后的值。map() 方法按照原始数组元素顺序依次处理元素。let arr = [1,22,34,56,76,89]let arr2 = arr.map((val,index,arr) => { return val + '修改'})// arr ["1修改", "22修改", "34修改", "56修改", "76修改", "89修改"]// arr2 [1,22,34,56,76,89.
2021-01-16 11:08:42
111
原创 js事件的防抖和节流
1.事件防抖在函数频繁触发时在设置特定时间段内只调用一次,从而达到多次变成少次,从而缓解浏览器或者服务器压力,比不影响功能。如:window.resize 和 mousemove 触发时频率特别高,可以在一定时间内调用一次,就能实现需求。代码实现 var demoFn = function(e){ console.log('我是当前函数',this,e) } function throttle(fn,during) { let star
2020-12-19 12:38:36
217
原创 vue项目根据配置加载组件生成表单
1、需求分析当前需求是完成导出平台,页面结构比较简单,上半部分是搜索的筛选项,下半部分是查询的内容列表和分页。如图所示。页面基本类似,主要包括 buttonGroup,select,date,input 和 button 等,2、接口文档分析接口地址按模块划分,相同筛选条件的入参相同(如图),返回字段后台已经罗列的出参字段对应的含义说明。3、考虑实现方案(1)每个页面单独实现工作量较大 —— 导出页面共计20多个。(2)各个页面组件基本 —— 表单组件和表格(3)
2020-11-23 09:55:36
1483
原创 图片上传增加水印并输出Bolob和file
<!DOCTYPE html><html><head><title>证件水印</title><style type="text/css">#waterMark { border: 1px solid #686de0;}#srcPic { border: 2px solid #686de0;}</style></head><body><div align="cente.
2020-09-14 11:28:56
340
原创 ivews的table组件 slot-scope 不显示
<Table height="300" border ref="selection" :columns="HeadData" :data="Data" > <template slot-scope="{ row }" slot="action"> <span>删除{{row}}</span> </template></Table>HeadData:.
2020-06-08 13:48:08
1052
原创 iview cdn加载字体图标正常, 本地加载js和css时加载不出字体图标
使用iview做一个小工具,为了项目不受其他平台影响,把cdn的js和css下载到本地引用,结果字体图标加载不出来了。查看network 发现加载字体图标的文件加载失败,他引用的是本地static/fonts 下的字体图标文件...
2020-06-02 10:13:33
1108
原创 根据对象路径获取对象的value
// 获取value的方法 obj为要获取的对象,path是路径 用.链接var getPropByPath = function (obj, path) { let tempObj = obj path = path.replace(/\[(\w+)\]/g, '.$1') path = path.replace(/^\./, '') let keyArr = path.split('.') let i = 0 for (let .
2020-06-02 09:35:57
616
原创 根据对象的路径修改对象下的属性
项目中遇到一个需求,循环显示表单例如input radio之类的,表单的值要根据返回数据配置的路径放在指定位置。例如:{ name:'用户姓名', type:'input', valPath:'a.b.c'}就是显示出用户姓名的input,input的value要放到a对象下的b对象下的c,且a对象初始化值可能是空。下面是设置函数var setVal = function (obj, value, ...keys) { keys.reduce((acc, cur, i
2020-06-02 09:29:25
561
原创 vue slot插槽v-show不能控制显示隐藏
slot本质上并不是一个元素,所以也就没有display 这个css属性。而v-show是通过控制元素的display来进行显示隐藏的,所以vue中想控制插槽的显示隐藏,用v-show是不起任何作用的,改用v-if 可以生效。...
2020-03-04 10:52:54
2984
1
原创 iview实现国际化
引入VueI18n import VueI18n from “vue-i18n”注入vue实例在local文件夹内准备两套文字(所有在项目中所需要用的文字全部存进来,在使用的时候使用$t()将变量包裹)用一个对象message接收两套文字(并引入iview的语言包,将自己的语言包与iview的语言包合并)准备一个变量用以切换中英文(存在localstorage中,任何页面点击切换时改变该变...
2020-03-04 10:41:10
340
转载 git常用命令
1,git push origin develop:master -f就可以把本地的develop分支强制(-f)推送到远程master
2020-02-04 15:32:48
89
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人