前端
文章平均质量分 53
H-L
过程比结果更重要!
展开
-
Eslint教程
https://www.jianshu.com/p/ad1e46faaea2https://www.jianshu.com/p/ad1e46faaea2两个月之前在项目中就开始使用 Eslint ,当时直接 copy 别人的 .eslintrc.js 文件,感觉好复杂,一直没吃透,中间去把 Eslint 官方文档看了数遍,依然无果。今天刚好没事,回过头来想整理一下 Eslint 的使用,突然发现变得好简单。总结下在这过程中走得弯路。先要知道 Lint 是什么,Eslint 又是什么; 因为想要的转载 2022-03-30 09:36:04 · 1429 阅读 · 0 评论 -
Vue - Table表格渲染上千数据优化
https://xuliangzhan_admin.gitee.io/vxe-table/#/table/start/installhttps://xuliangzhan_admin.gitee.io/vxe-table/#/table/start/install基于vue的表格组件转载 2022-01-24 09:49:23 · 828 阅读 · 0 评论 -
react-router-dom中的BrowserRouter和HashRouter
react-router-dom中的BrowserRouter和HashRouter - 尚码园HashRouter包裹下访问根服务:假设为 localhost:3000/html 1 import { HashRouter as Router, Route, Redirect } from 'https://www.shangmayuan.com/a/af68203cea59416a9a5cd04e.htmlHashRouter包裹下访问根服务:假设为 localhost:3000/html 1转载 2021-11-16 13:56:57 · 809 阅读 · 0 评论 -
记录项目使用webpack-parallel-uglify-plugin报错Maximum call stack size exceeded
转载https://blog.csdn.net/weixin_42381896/article/details/110438792?utm_medium=distribute.pc_relevant.none-task-blog-baidujs_title-1&spm=1001.2101.3001.4242转载 2021-03-24 16:14:46 · 179 阅读 · 0 评论 -
this.$refs 获取不到解决办法
问题描述页面一进来初始化之后,需要通过获取this.$refs 调用子组件中的某个方法,但是获取不到,返回undefind解决过程:楼主查询了原因,是这样解释的:ref 需要在dom渲染完成后才会有,在使用的时候确保dom已经渲染完成。比如在生命周期 mounted(){} 钩子中调用,或者在 this.$nextTick(()=>{}) 中调用。 如果ref 是循环出来的,有多个重名,那么ref的值会是一个数组 ,此时要拿到单个的ref 只需要循环就可以了。这里就涉及到VUE生命周期转载 2021-01-06 17:52:35 · 8250 阅读 · 0 评论 -
新手究极搭建react-native环境解决pod install 卡住
https://www.jianshu.com/p/35c928bac18d首先说明,react-native对新手很不友好,按照官网说的会遇到很多的问题。第一个遇到的问题,高版本的react-native需要安装许多地依赖,而且一般的网络环境很难装成功,这也是我浪费了整整一天的时间得来的教训。react-native init MyApp#默认创建最新的版本接着就会提示image-20201016095511241接着cd ./MyApp/iospod..转载 2020-11-25 16:08:07 · 1039 阅读 · 0 评论 -
解决两个浮点型数字相加、相减精度丢失问题
https://blog.csdn.net/qq_43639075/article/details/102936534两字数据相加精确处理/** * @param {*} 数字1 * @param {*} 数字2 * @description 两字数据相加精确处理 */export const addNum = function () { let args = arguments// 获取所有的参数 let d = 0// 定义小数位的初始长度,默认为整数,即小数位为0.转载 2020-11-24 16:15:16 · 2038 阅读 · 0 评论 -
JS中使用Element的消息确认框并可触发回调函数!!
https://blog.csdn.net/m0_46627730/article/details/108446544JS中使用Element的消息确认框并可触发回调函数!!一:JS文件引入element的消息确认框 二:JS文件使用MessageBox,同时可触发回调函数最近在弄只有通过身份验证后才能登入组件,未通过的先通过element-ui的消息提示框告知用户未登录,待用户按下确认键后自动跳转到登录界面。虽然在js中引入messagebox并使用它是比较简单的,但我按照原本的用法..转载 2020-11-04 14:32:07 · 1211 阅读 · 0 评论 -
vue项目如何避免子元素触发父元素的mouseout事件
https://blog.csdn.net/wsxc451/article/details/104239969使用yarn安装时,有时候会出现版本问题;造成mouseover mouseout全部分类菜单放上后子元素会触发mouseout ;最终查到原因是因为浏览器兼容性问题;项目中给父元素加了mouseover、mouseout事件,但是,鼠标移动到子元素上总会自动触发mouseout事件,使用prevent、stop或者self修饰符都没什么用。如果用mouseover mouseo..转载 2020-10-30 16:43:13 · 1533 阅读 · 0 评论 -
vue项目中z-index强制被修改成1的问题
原因是之前的写法不被cssnano新版本支持需要修改postcssrc.js将cssnano下的内容修改为"cssnano-preset-advanced":{ zindex: false, autoprefixer: false}原创 2020-10-30 16:35:29 · 775 阅读 · 0 评论 -
setinterval不会清除定时器队列,每重复执行1次都会导致定时器叠加,最终卡死你的网页
setinterval和settimeout的区别在vue.js项目中,经常需要对数据实时更新——每隔xx秒需要刷新一次接口——即需要用到定时器相关原理我们先看一看2种常用定时器: 1 2 setInterval(function(){}, milliseconds)——会不停的调用函数 setTimeout(function(){}, milliseconds)——只执行函数一次 乍看之下,setInterval会符合我们的业务需求,然而转载 2020-10-30 15:30:30 · 6135 阅读 · 0 评论 -
vue项目在ie浏览器中打开空白问题
vue项目运行编译,发现在IE浏览器一片空白,解决方法:1、安装babel-polyfill: npm install babel-polyfill --save-dev2、在main.js文件中引入:import'babel-polyfill'3、在webpack.base.config.js中将entry中的app:./src/main.js'改为下面格式entry:{app:['babel-polyfill','./src/main.js']},4、重新...转载 2020-10-30 15:20:09 · 1051 阅读 · 0 评论 -
数字千分位格式化问题
当系统中涉及到很多金额并且数额较大时需要对数字进行千分位格式化,提升数字的可阅读性具体方式,可以封装一个方法export function formatCurrency(num) {if (num || num == 0) {// 将num中的$,去掉,将num变成一个纯粹的数据格式字符串num = num.toString().replace(/\$|\,/g, '')// 如果num不是数字,则将num置0,并返回if (num === '' || isNaN(num)) {原创 2020-10-30 14:04:20 · 996 阅读 · 0 评论 -
js中有关小数点失精问题
今天用vue做小数点转换百分比的时候遇到:0.55*100 =55.00000000000001,起初以为是vue计算方式有问题,后来想到js有小数点失精的问题,结果测试了一下果然是这个问题:js失精算法console.log(0.1+0.2); //0.30000000000000004console.log(0.07*100); // 7.000000000000001console.log(0.119*100); // 11.899999999999999.........转载 2020-10-30 13:55:56 · 1102 阅读 · 0 评论 -
axios不会对url中的功能性字符进行编码
在请求中如果url包括特殊字符的话,可能会导致接口接收参数失败,所以前端一般会对特殊字符进行encode,方法有两种encodeURI()对整个url进行编码,会避开url中的功能性字符,例如,& ? [ ]编码前:http://10.10.67.67:8080/api/chain/basic/users?params=+[编码后:http://10.10.67.67:8080/api/chain/basic/users?params=%2b[encodeURIComponent()转载 2020-10-30 13:51:15 · 1194 阅读 · 1 评论 -
vue watch handler
普通监听缺点:不能深度监听(对象属性的改变),刷新或首次加载不能执行。watch: { carts: function (val, oldVal) { console.log('new: %s, old: %s', val, oldVal) } }高级监听 handle:wat...转载 2019-12-18 15:18:06 · 4283 阅读 · 0 评论 -
有关sessionStorage在同一网站多个标签页内共享数据的问题总结,这取决于标签页如何打开
文章转载自:https://github.com/lmk123/blog/issues/66一直以来,我所以为的sessionStorage的生命周期是这样的:在 sessionStorage 中存储的数据会在当前浏览器的同一网站的多个标签页中共享,并在此网站的最后一个标签页被关闭后清除。注意:这是错误的。我之所以会这么认为,是因为我写代码的时候,sessionStorage 给我的表...转载 2019-12-17 16:01:16 · 1711 阅读 · 0 评论 -
vscode 代码格式化
如果你想快速配置自己的 vscode 支持保存自动格式化功能一、安装以下几个 vscode 扩展程序:ESLintPrettier - Code formatterVetur如图:二、打开 settings 文件打开方式:先按步骤打开 setting 界面,Code --> preferences -->setting (也可以快捷键 command...转载 2019-11-26 17:33:25 · 2065 阅读 · 0 评论 -
使用ESLint+Prettier来统一前端代码风格
加分号还是不加分号?tab还是空格?你还在为代码风格与同事争论得面红耳赤吗?正文之前,先看个段子放松一下:去死吧!你这个异教徒!想起自己刚入行的时候,从svn上把代码checkout下来,看到同事写的代码,大括号居然换行了。心中暗骂,这个人是不是个**,大括号为什么要换行?年轻气盛的我,居然满腔怒火,将空行一一删掉。但是关于代码风格,我们很难区分谁对谁错,不同的人有不同偏好,唯有...转载 2019-11-26 16:56:51 · 312 阅读 · 0 评论 -
wepy小程序框架中events的使用
注意:下面以红色文字标注的位置是特别强调events的使用场景的组件通信与交互wepy.component基类提供$broadcast、$emit、$invoke三个方法用于组件之间的通信和交互,如:this.$emit('some-event', 1, 2, 3, 4);用于监听组件之间的通信与交互事件的事件处理函数需要写在组件和页面的events对象中,如:import...转载 2019-11-26 16:39:49 · 1383 阅读 · 0 评论 -
wepy 开发文档
快速入门 1,项目创建和使用 安装wepy,一下都是通过npm安装 npm install wepy-cli -g 2,在开发目录生成开发DEMO。 wepy new project 3,开发实时编译 wepy build --watch 4,项目目录结构...转载 2019-11-26 16:30:00 · 469 阅读 · 0 评论 -
wepy-plugin-replace插件
安装npm install wepy-plugin-replace --save-dev配置wepy.config.js为 plugins 添加 replace 对象,支持单个或者多个规则,多个规则可以以 Array 或者 Object 实现,filter 的对象为生成后文件的路径, 例如'dist/app.js',每个规则也同时支持多个替换条目,同样是以 Array 或者 Obj...转载 2019-11-26 16:21:14 · 416 阅读 · 0 评论 -
基于Wepy开发小程序插件推荐
开发wepy-plugin-autopages使用 wepy 开发项目时不需要手动配置 app.wpy 下的 config.pages,autopages 插件会自动监控 pages 目录下文件的变化,自动生成更新对应 app.json 下的 pages。注意:该插件只会对编译文件dist里配置添加,源文件是不会改动的。注意:我还发现有个问题是他是按命名顺序添加的,所以开发阶段可以用...转载 2019-11-26 16:18:56 · 930 阅读 · 0 评论 -
WePY根据环境变量来改变运行时的参数
参考:https://github.com/Tencent/wepy/wiki/WePY%E6%A0%B9%E6%8D%AE%E7%8E%AF%E5%A2%83%E5%8F%98%E9%87%8F%E6%9D%A5%E6%94%B9%E5%8F%98%E8%BF%90%E8%A1%8C%E6%97%B6%E7%9A%84%E5%8F%82%E6%95%B0在package.json中使用s...转载 2019-11-26 15:58:59 · 550 阅读 · 0 评论 -
elementUI中el-upload上传文件时附带额外参数传递
公司vue项目中,文件上传这块先前一直使用的单独接口,即只是单纯的上传文件接口,上传完了拿到文件的id之后再调用文件关联绑定关系的接口,上传的代码如下即可:需要上传的url地址 以及hearders中的token等等后面因为后台人员对接口进行了优化,上传以及保存绑定关系接口合并成一个,这里就需要上传文件时附带需要传递其他参数,搜索了一下官网,有专门的:data属性来传递额外的参数。...原创 2019-11-26 10:30:05 · 12077 阅读 · 2 评论 -
vue中使用原生WebSocket
1、优化参考了网上几篇文章,对其中代码做了优化,加了重连机制和心跳检测,添加相应注释。我刚尝试的时候因为没有websocket服务端,无意中发现一个免费的服务端。一个帅哥服务端如果你想自己玩玩WebSocket, 但是你又不想自己部署一个WebSocket服务器,你可以使用ws = new WebSocket('wss://echo.websocket.org/'), 你向ech...转载 2019-10-30 17:08:43 · 1020 阅读 · 0 评论 -
vue中watch的详细用法
转载:https://www.cnblogs.com/shiningly/p/9471067.html转载 2019-10-28 17:24:47 · 337 阅读 · 0 评论 -
Vue如何给组件绑定原生事件
由于组件上面的事件默认为自定义事件,那么此例中<child @click="handleClick"></child>不会被系统识别为我们理解中的点击事件必须通过$emit方法绑定它才行。这样组件内外都要定义方法未免有点麻烦,那么想在组件上直接使用原生事件怎么办?给事件加个后缀.native就行:显然,我们推荐第二种方法,代码少了不是一行两行啊~...转载 2019-10-14 17:52:57 · 561 阅读 · 0 评论 -
npm和yarn的区别,我们该如何选择?
周一入职,同事JJ让我熟悉一下基于React的新项目。按照以往,我的步骤都是:这时,JJ给我来了下面一段“咦,yarn是什么鬼?难道npm更高级的替代品?为什么要替代npm?难道有什么好的地方?”,内心一连串的问题冒出来。我就默默的问了一下JJ:“yarn是跟npm一样的东西吗?”,“嗯。”JJ忙碌的敲着键盘,显然这个问题不值得继续问下去了。我也默默的把刚才脑子里一连串的问题记了...转载 2019-10-12 15:58:29 · 139 阅读 · 0 评论 -
MAC应用无法打开或文件损坏的处理方法
https://xclient.info/a/74559ea2-7870-b992-ed53-52a9d988e382.html有些用户下载了一些程序之后,却发现无法在MAC中安装,安装时会弹出下图所示警告框:“打不开 xxx,因为它来自身份不明的开发者”。那么该如何解决这个问题呢?在MAC下安装一些软件时提示"来自身份不明开发者",其实这是MAC新系统启用了新的安全机制。默认只信任M...转载 2019-10-12 14:05:11 · 803 阅读 · 0 评论 -
安全与隐私没有允许任何来源选项
https://jingyan.baidu.com/article/eae07827b403931fec548586.html在mac10.12的版本里边安全与隐私一项中没有了允许任何来源的选项了,不知道大家发现没有!工具/原料 苹果电脑一台 打开终端输入命令 方法/步骤 打开电脑搜索 输入终端 3 打开终端输入 sud...转载 2019-10-12 14:03:45 · 1042 阅读 · 0 评论 -
SourceTree和Github Desktop
SourceTree和Github Desktop都是管理git代码仓库(http://www.git-scm.com)的图形化界面。最近发现SourceTree还是蛮好用的,因此与Github Desktop做一些比较。SourceTree(https://www.sourcetreeapp.com)是Atlassian旗下的一款免费的git客户端软件。我最先知道这个软件,是在大概二三年前,...转载 2019-10-12 10:20:04 · 3493 阅读 · 1 评论 -
top.location与this.location
top.location != this.location 就是说当前窗体的url和父窗体的 url不相同(url主要是指是否为同一个域)通常情况下的用法为:if(top.location != this.location){ top.location=this.location;}这个主要是为了防止别的网站嵌入你的网站(比如用iframe嵌入其他网站)...原创 2018-04-23 11:51:19 · 2728 阅读 · 0 评论 -
ps制作gif动画方法以及有毛边问题解决
ps制作gif动画流程方法:以制作一个报警图标闪烁为例1.导入图片,选择窗口-时间轴2.选中时间轴第一幁 更改时间为0.1s3.选中第一帧复制4.先将最后一帧的不透明度设置为0%5.选中第二帧,然后选择过渡动画帧按钮进行设置过渡参数6.存储为web所用格式,通常保存下来的gif动图都会都毛边,处理方式为,在保存的时候将“杂边”这项的颜色值设置成你页面的颜色值一致,这样保存下来的gif动画图,放到你...原创 2018-05-02 17:29:08 · 10738 阅读 · 0 评论 -
多元素高度不一致浮动错位问题
当多元素高度不一致时,经常会出现,元素错位的现象,如下:当给浮动元素加上clear:both后即可完美解决原创 2018-04-25 15:28:00 · 1770 阅读 · 0 评论 -
element中组件el-autocomplete远程搜索之精确匹配和模糊匹配
在实际开发项目中总是会遇到很多难以预测的情况,比如el-autocomplete的远程搜索时,经常会从服务器发起搜索,然后把对象带出的相关值赋给其他标签元素,一般模糊匹配没问题,但是精确匹配会存在一个问题(当从服务器获取到对象的值赋给其他元素时,dom元素不能及时更新问题)以上页面需要通过搜索维特号然后带出相关的项目名称和梯号以及注册代码,因为这里维特号需要精确匹配,就会出现不能及时更新的问题,具...原创 2018-05-30 09:52:32 · 13852 阅读 · 6 评论 -
在Vuex使用 以及 dispatch和commit来调用mutations的区别
Action 提交的是 mutation,而不是直接变更状态。Action 可以包含任意异步操作。Action 通常是异步的,那么如何知道 action 什么时候结束呢?更重要的是,我们如何才能组合多个 action,以处理更加复杂的异步流程?首先,你需要明白store.dispatch可以处理被触发的 action 的处理函数返回的 Promise,并且store.disp...转载 2019-04-09 18:00:14 · 1971 阅读 · 1 评论 -
vue中$nextTick()作用
vue更新数据是异步的1.0 中确实是通过 v-el:xxx 标记 dom 然后在组件里通过 this.$els.xxx 就可以获得这个 dom 对象了$nextTick(() => {}) 与DOM相关操作写在该函数回调中,确保DOM已渲染什么是Vue.nextTick()官方文档解释如下:在下次 DOM 更新循环结束之后执行延迟回调。在修改数据之后立即使用这个方法,获取更新后的 DOM。...转载 2018-05-30 11:49:46 · 757 阅读 · 0 评论 -
用 vue-route 的 beforeEach 实现导航守卫(路由跳转前验证登录)
路由跳转前做一些验证,比如登录验证(未登录去登录页),是网站中的普遍需求。对此,vue-route 提供的 beforeRouteUpdate 可以方便地实现导航守卫(navigation-guards)。导航守卫(navigation-guards)这个名字,听起来怪怪的,但既然官方文档是这样翻译的,就姑且这么叫吧。贴上文档地址:https://router.vuejs.org/zh-cn/ad...转载 2018-05-30 11:52:58 · 1046 阅读 · 0 评论 -
vue路由当中的导航钩子中关于next这个方法的描述应该如何理解?
之前写的一篇文章,里面有具体demo作解释,参考一下vue.js路由vue-router(二)——路由进阶在这里我用通俗点的说法解释上next(),next(false),next('/'),next(error),希望通过这接地气的解释你能掌握这几个知识点。背景:你乘坐汽车从A景区想赶往B景区(模拟路由A跳转到路由B)1.next()你乘坐汽车要从A景区到B景区,路过关卡时,守门人拦下你,你量出...转载 2018-05-30 12:04:16 · 10734 阅读 · 5 评论