前端
woyaoshengzhang
这个作者很懒,什么都没留下…
展开
-
localStorage,sessionStorage 和 cookie区别
【代码】localStorage,sessionStorage 和 cookie区别。原创 2024-02-01 16:06:08 · 413 阅读 · 1 评论 -
webpack使用
1. 安装webpack,webpack-cli只安装webpack,运行webpack -v 提醒我需要安装webpack-clisudo cnpm install webpack -gsudo cnpm install webpack-cli -gwebpack -v # webpack: 5.72.0 webpack-cli: 4.9.2原创 2022-04-15 15:36:49 · 902 阅读 · 0 评论 -
使用verdaccio搭建私有npm库
1. 全局安装verdaccionpm install verdaccio -g2. 启动verdaccio此时,verdaccio已经启动,http://localhost:4873/ 已经可以访问,但是只能在本机访问。可以修改配置文件,通过访问ip的方式来访问。在 .config/verdaccio/config.yaml 文件末尾添加listen: 0.0.0.0:4873重新运行启动命令,便可以通过http://ip:4873的方式访问了。3. 使用pm2来启动verdacc原创 2021-12-02 17:32:51 · 1452 阅读 · 0 评论 -
正则表达式及常用的正则验证
字符描述^匹配开头$匹配结尾\将下一个字符标记为特殊字符*匹配0次或多次,相当于{0,}?匹配0次或1次,相当于{0,1}+匹配1次或多次,相当于{1,}{n}匹配n次{n,}至少匹配n次{n,m}至少匹配n次,最多匹配m次{n}匹配n次字符描述?跟在其他限制符后,表示非贪婪匹配,默认贪婪模式。例如对于字符串"ooo",o+?匹配到"o",o+匹配到"ooo".匹配除换行符外的...原创 2021-11-29 17:11:05 · 210 阅读 · 0 评论 -
将已有react+umi项目替换为MFSU启动方式
使用npm start启动项目时耗时长,使用umi dev可以加快启动速度,第一次使用会比较慢,之后启动时间在2s左右,热更新平均 600ms 左右MFSU issue地址 https://github.com/umijs/umi/issues/6766操作前先检查是否全局安装umiumi -v我的项目虽然使用了umi.js,但是没有全局安装。后面运行 umi dev时报错 umi: command not found。全局安装 uminpm install -g umi // win.原创 2021-07-30 11:06:43 · 2105 阅读 · 0 评论 -
react + ant-ProTable 表格跨页选择
protable 选择行设计到的api有onSelect - 单行选择onSelectMultiple - 多行选择(使用shift键可以触发多选)onSelectAll - 全选全不选onChange - 每次选择行都会触发onChange,并且是后执行。跨页选择逻辑cancleRowKeys - 取消选择的行mySelectedRowKeys - 选中的行选择行时,判断是选择还是取消选择,如果是取消选择,将行key存储至 cancleRowKeys 中在onChange 方法中原创 2021-07-02 10:40:02 · 1528 阅读 · 0 评论 -
vue 为路径设置别名
vue-cli3在vue.config.js文件中配置路径别名const path = require("path");const resolve = (dir) => { return path.join(__dirname, dir);};module.exports = { chainWebpack: config => { config.resolve.alias.set('@',resolve('src')) }};...原创 2021-06-16 17:16:31 · 102 阅读 · 0 评论 -
dom元素尺寸和位置
一、尺寸clientWidth /clientHeight 包含元素内容 + padding + border clientWidth 270 , clientHeight 100scrollWidth /scrollHeight 包含元素内容 + padding, scrollWidth 270 , scrollHeight 100 . 如果内容溢出该元素,并且存在滚动条,值为 真实内容高度(含溢出高度) +...原创 2021-05-26 11:23:45 · 93 阅读 · 0 评论 -
生成uuid
// 生成uuidexport function getUUID() { return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, c => { return (c === 'x' ? (Math.random() * 16 | 0) : ('r&0x3' | '0x8')).toString(16) })}原创 2021-05-19 11:04:53 · 168 阅读 · 0 评论 -
vue 路由传参的3种方式
1. 路由配置// 页面路由格式 /detail/1// 页面刷新后路由参数依然在。// 路由定义{ name:'Detail', path:'/detail/:id', component:Detail}// 页面跳转this.$router.push({ path:'/detail/1',})// 或者同方式2this.$router.push({ name:'Detail', params:{id:1}})// Deta原创 2021-05-17 17:32:14 · 198 阅读 · 0 评论 -
vue slot插槽
1. 匿名插槽<!-- parent --><Children> <h4>标题内容</h4><!-- 匿名插槽默认用default做参数,v-slot仅能用于template标签 <template v-slot:default> <h4>标题内容</h4> </template> --></Children><!-- chil原创 2021-05-08 15:26:38 · 121 阅读 · 0 评论 -
vue 组件通信
1. 父子组件通信1.1 父传子值props// parent<Children msg="success" />// childrenprops: { msg: String}1.2 子传父值,父改子值$refs// parent<Children ref="cld" />mounted(){ console.log(this.$refs.cld.content) this.$refs.cld.content='我是父原创 2021-05-07 11:14:43 · 85 阅读 · 0 评论 -
常用的正则验证
// 邮箱const isEmail = (value) => { return /^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+((.[a-zA-Z0-9_-]{2,3}){1,2})$/.test(s)}// 手机号码const isMobile = (value) => { return /^1[0-9]{10}$/.test(value)}// 电话号码const isPhone = (value) => { return .原创 2021-04-16 09:51:22 · 114 阅读 · 0 评论 -
react+antpro 打包后生成大体积文件之优化
概述使用antpro 框架做了一个react 项目,打包后umi.js文件体积差不多有1.4M。后来使用gzip压缩方式,将其压缩到421kb,大大缩短加载时间。查看项目文件大小可以通过两种方式,查看具体产生了哪些大文件。1. 使用开发者工具的Network,可以查看浏览器加载了哪些文件及用时。2. 使用npm 自带的分析工具,运行命令后后自动弹出分析结果网页。npm run analyzeStat -- 转换前的体积Parsed -- 最终打包体积Gzippe原创 2021-04-09 17:59:58 · 1880 阅读 · 0 评论 -
解决上传图片自动旋转的问题以及对图片进行压缩上传
1. 关于图片自动旋转原因在使用PS或者其他软件旋转图片时,图片旋转了,但Orientation不会改变,由于我们使用的图片预览器能够预处理图片,使其看起来与旋转后一致,但上传图片时,浏览器并不会预处理。所以导致图片旋转。EXIF中,包含一个Orientation参数,用来记录拍摄照片时的方向,其中1是正常。2. 解决旋转问题,需引入exif.js文件 下载链接http:/...原创 2019-11-07 19:43:49 · 31347 阅读 · 0 评论 -
mui 下拉刷新的页面,第一次不会自动刷新获取数值的问题
修改mui初始化,将上面代码替换为下面代码//mui初始化mui.init({ pullRefresh: { container: '#pullrefresh', down: { auto: true, style:'circle', contentdown: '', callback: scope.pulldownRefresh }, up: {...原创 2019-10-19 14:20:11 · 282 阅读 · 0 评论 -
js插件-在线预览pdf文件
在线预览pdf文件功能原创 2018-06-05 15:37:37 · 1443 阅读 · 0 评论 -
不同浏览器的专属hack
1. IE浏览器前缀:-ms-{-ms-transform:none;}ie不同版本的hack 参考网址:http://www.webhj.com/hj-650.html .box{ color:#333; /* 所有浏览器 */ color:#333\9; /* ie6,7,8,9,10 */ color:#333\0; ...原创 2018-09-19 09:37:57 · 171 阅读 · 0 评论 -
取消input焦点,返回上一页
1.取消页面打开时input输入框自动获取的焦点<input type="text" onfocus="this.blur();">2.返回上一页<a href="javascript:history.back(-1)">返回上一页</a> ...原创 2018-11-07 15:37:37 · 3657 阅读 · 0 评论 -
关于sublime text3 的Tab键缩进问题
一、换行无法自动缩进的问题,如图: 在首选项 - 按键绑定 - 用户中(Preferences - Key Bindings-User)加入以下代码: { "keys": ["enter"], "command": "auto_indent_tag", "context": [ { "key": &转载 2018-04-02 13:38:46 · 15813 阅读 · 1 评论