自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(67)
  • 收藏
  • 关注

原创 当git clone遇到client_loop:send disconnect: Connection reset by peer00 Kib/s

client_loop:send disconnect: Connection reset by peer00 Kib/s

2023-02-26 00:33:32 2469

原创 如何设置Vant 中的Toast的延迟时间

修改vant中的toast的默认时间

2022-08-02 09:25:04 1704

原创 net::ERR_CONNECTION_TIMED_OUT

net::ERR_CONNECTION_TIMED_OUT最近发现分享至外部浏览器时,接口报了个错net::ERR_CONNECTION_TIMED_OUT。本着面向百度开发,面对CSDN开发的原则。第一步大家都懂的。问题现象分享至外部浏览器打开,页面空白,F12打开控制台,果然是接口没返回。还报了下图的错。但是直接访问接口地址却能正常返回。更神奇的是,第二次请求却能正常发送并且成功返回。问题原因根据报错信息,一顿百度,网上各种方法都解决不了,什么接口返回数据量过大呀。这个接口之前都是ok的

2021-06-12 17:42:26 12798 2

转载 移动端那些戳中你痛点的软键盘问题及解决方法

移动端那些戳中你痛点的软键盘问题及解决方法问题:问题描述:在ios手机中,当页面中包含有输入框时,点击输入框,键盘弹起,会让页面中被fixed的元素失效。所以造成了底部吸底和顶部吸顶的元素错位的问题。下面的视频中就出现了这个问题,吸顶元素被推到可视区之外去了,而吸底元素也被推到了键盘之上。解决方案解决方案...

2021-05-16 15:59:28 242

原创 解决element-ui/element-plus中el-pagination分页组件显示英文

解决element-ui/element-plus中el-pagination分页组件显示英文解决方法:在main.js或main.ts中引入中文语言import locale from 'element-plus/lib/locale/zh-zn' //element-plus// import locale from 'element-plus/lib/locale/zh-CN' // element-uiconst app= createApp(App)app.use(ElementP

2021-04-11 22:35:10 2918 6

原创 笔记

笔记1.Vue-Injection elForm not found1)将el-form-item标签是否在el-form标签包裹下2. 修改element-ui的table 在鼠标悬停hover时的高亮颜色css:.el-table tbody tr:hover>td { background-color:#ecf5ff!important}3.Property xxx was accessed during render but is not defined on ins

2021-04-10 23:08:26 226

原创 npm安装淘宝镜像和查看镜像设置

npm安装淘宝镜像和查看镜像设置1.通过cnpm使用淘宝镜像:npm install -g cnpm --registry=https://registry.npm.taobao.org2.将npm设置为淘宝镜像:npm config set registry https://registry.npm.taobao.org查看cnpm镜像设置:npm config get registry 4.查看cnpm镜像设置:cnpm config get registry ...

2021-03-25 23:19:06 282

原创 [警告][vue-router] Duplicate named routers definition: {name: “index“, path: “/index“}

[警告][vue-router] Duplicate named routers definition: {name: “index”, path: “/index”}说明路由命名的name属性重复。举例:{name: “index”, path: “/index”, redirect: “/xxx/xxx”}改正:{name: “index”, path: “/indexPage”, redirect: “/xxx/xxx”}若是动态路由,name没有重复也会报类似警告。...

2021-03-15 22:03:44 887 2

原创 使用ElementUI 报错Cannot read property ‘tableId‘ of undefined

Cannot read property ‘tableId’ of undefined写代码时会一不注意就会发生的的问题。使用elementUI的表格模板是会报错Cannot read property 'tableId' of undefined

2021-03-15 21:49:04 1992 2

原创 error:Your local changes to the following files would be overwritten by merge:

error:Your local changes to the following files would be overwritten by merge:1. 用git pull来更新代码的时候,遇到了以下报错信息:error:Your local changes to the following files would be overwritten by merge: xxx/xxx/xxx.vue Please, commit your changes or stash them before y

2021-03-15 00:18:47 2472

原创 npm私有仓库搭建

npm私有仓库搭建一直都有搭建属于自己的npm私库,但由于懒,一直拖到今天。嗯,上班时间悄悄的的敲了一下(嘘????),原来挺简单的。嘿嘿~~背景1.Node.js开发本地项目,有时不同项目之间存在依赖,如果不想把项目发布到npm社区的仓库,则需要有自己本地的仓库。2.有些公司采用的是内网开发,很多npm资源无法从内网去下载(当然很多公司有自己的私服)。sinopia(主流)使用文件系统作为存储,仅保存用户需要的包,如果本地仓库没有对应的包,则从指定的registry下载,默认为npmjs.or

2021-02-18 20:36:22 1450

原创 swiper插件loop模式下图片索引显示错乱问题

swiper插件loop模式下图片索引显示错乱问题问题:loop模式开启后由于首尾多复制一个silde,导致realIndex出现大于数组length的情况swiper在做图片轮播时候还是蛮常见的,在使用过程中当设置为loop:true的时候,会发现轮播时候获取到的aactiveIndex是错乱的。解决方案方案一百度上有人说,原因是当给swiper设置了loop:true的时候,会自动在dom元素中重复生成第一张和最后一张填充到swiper-wrapper中,所以索引会和实际图片轮播时候的索引值对

2021-02-08 21:31:23 2448

原创 Vue 文本超过三行展示省略号,并加上展开和收起的功能

在写实现之前,先给大家看一下效果大概如下:在处理多行文本时,经常会遇到各种各样的需求,比如至多展示三行,多余的部分不展示并以省略号结尾;又比如在这个基础上加上一个展开和收起的功能。同时UI的展示上还要求和文本本身的位置相对应。具体实现思路如下:1、判断当前内容是否超过三行。此处可以给每行设置一个行高line-height,渲染完后超过三倍的行高即认为是内容超过了三行。2、展示/收起状态的切换可以通过data中的参数来绑定3、在底部使用position:absolute来绝对定位展开该在的位置。

2021-01-19 00:40:28 2200 2

原创 使用`speed-measure-webpack-plugin`尝试分析`webpack`打包速度

使用speed-measure-webpack-plugin尝试分析webpack打包速度在实际开发的过程中,我们不可避免的会使用webpack进行打包,有时候会觉得打包速度有些慢。但是又不清楚慢在哪,优化无从下手。这里介绍一下,使用speed-measure-webpack-plugin尝试分析webpack打包速度。官网:https://www.npmjs.com/package/speed-measure-webpack-plugin...

2020-12-07 19:59:18 2107

原创 初次尝试在Mac使用vue-cli快速构建vue项目--踩坑记

初次尝试在Mac使用vue-cli快速构建vue项目–踩坑记首先介绍一下Vue-cli是Vue官方提供的脚手架工具,默认已经配置好了一套基于webpack管理的Vue项目结构。官网: https://cli.vuejs.org/zh由于是踩坑记,这里主要讲的是在搭建过程的踩坑,正常构建可能就不是重点了哈。1 搭建环境npm install -g @vue/cli //下载并安装vue-clivue list // 检测是否安装成功,注意这里不用vue -v来检测正常的在检测是否成功安装,

2020-12-07 00:44:30 389

转载 写一个eventEmitter类,包括on()、off()、once()、emit()方法

写一个eventEmitter类,包括on()、off()、once()、emit()方法1.on(event, fn) 监听event 事件,事件触发时调用fn函数;2.once(event, fn) 为指定事件注册一个单次监听器,单次监听器最多只触发一次,触发后立即解除监听器;3.emit(event, arg1, arg2, arg3, …): 触发event事件,并把参数arg1, arg2, arg3… 传给事件处理函数;4.off (event, fn) 停止监听某个事件class E

2020-11-25 22:15:31 1031 1

原创 执行npm install时报错: MaxListenersExceededWarning:Possible EventEmitter memory leak detected

执行npm install时报错: MaxListenersExceededWarning:Possible EventEmitter memory leak detected最近几天在用公司的星盘配置我们的运营内管时,发现在执行npm install 时,报了一个MaxListenersExceededWarning:Possible EventEmitter memory leak detected在网上搜了一圈,大都给了个类似的解答;在vue.config.js 文件中添加require('e

2020-11-25 21:43:36 8496 10

原创 location.reload()和location.replace()的区别与应用

location.reload()和location.replace()的区别与应用

2020-11-18 23:57:25 3674

原创 基于Vue骨架屏的实现

骨架屏的实现作为前端,不可避免的会遇到页面加载比较慢时,页面会有段时间是空白,这个对用户的体验明显是很不友好的。解决的方案有很多种,今天我们谈谈使用骨架屏的实现。

2020-11-15 18:09:59 456 2

原创 移动端的“吸顶”效果

“吸顶”效果“吸顶”效果是比较常见的一种样式效果。.fixed { position: fixed; top: 0; left: 0; bottom: 0;}$(window).scroll(function () { var documentH = $(document).height() var clientW = $(window).width() var clientH = $(window).height() var titleTop = clientW / 750 * 5

2020-11-13 00:39:47 566

原创 字符串的转换

字符串的转换数字 布尔值等其他数据类型都可以转换成字符串;一般来说,脚本引擎将根据上下文自动完成这样的转换。例如,当把数字或布尔形变量传给希望接收的字符串变量的函数时,就会先隐式将该数值转换成字符串,再进行处理;var num = 35.00alert(num)如果在赋值语句中要对两个变量执行加法操作,其中一个事字符串变量,而另一个是数字变量,那么数字会自动转换成字符串,再进行连接;var str1 = '4' + 3 + 2 //结果是432var str2 = 4 + 3 + '2' //

2020-11-12 21:42:39 178

原创 如何区分平台 -- web浏览器 or 手机端

如何区分平台 – web浏览器 or 手机端作为前端,不得不说说终端的一些事。有些时候,产品要求在web端和手机端展示的样式不一样。那么,我们该怎么去区分不同的终端呢?

2020-11-12 21:19:46 587

原创 Vue项目 + Angular 收银台

,dans# Vue项目 + Angular 收银台问题:Vue项目中需要接入Angular编写的收银台之前开发的一个新项目,用的是Vue-cli 2.0搭的架子,但是由于收银台模块是公用项目,暂时不可能重构。但是现在做的项目又比较急,将涉及到收银台的页面重构成H5页面或者Anguar,都不大现实。一是时间紧,而是我对Angular不是太熟。商城类的项目又不可能没有收银台。解决方案: 引入Ionic思考这种方式虽然解决了这种问题,使得在Vue项目中成功调用了Angular语言编写的收银台。但是由于

2020-09-02 00:10:21 396

原创 解决input框在ios机型上需要连续双击才能调起键盘的问题

解决input框在ios机型上需要连续双击才能调起键盘的问题fastClick

2020-08-06 17:40:28 2257 1

原创 最最常用的26条Linus命令整理

最最常用的25条Linus命令整理文件和目录1.cd /home 进目录2.cd .. 回上一级目录3.cd -回上一次所在目录4.pwd 显示工作路径5.ls 查看目录中的文件6.ls -F 查看目录中的文件7.ls -1显示文件和目录的详细资料8.ls -a显示隐藏文件9.mkdir dir1创建一个叫做‘dir1’的目录10.rm -f file1 删除一个‘file1’文件11.rmdir dir1 删除一个‘dir1’目录12.rmdir -rf dir1 删除一个‘di

2020-07-23 23:44:59 430

转载 字符串剪切

字符串剪切

2020-07-12 16:58:51 830

原创 toFixed与toPrecision之间的区别

toFixed与toPrecision之间的区别toFixed(n):返回一个字符串,代表一个以定点表示法表示的数字。n在0~20之间var a = 1.023var b = a.toFixed(2) // 1.02typeof b // stringtoPrecision(n):返回一个字符串,其中包含一个以指数记数法或定点记数法表示的,具有指定数字位数的数字。n在1~21之间对于以指数记数法表示的数字,将返回小数点后的 n-1 位数字。对于以定点记数法表示的数字,将返回 n 位

2020-07-12 16:51:36 1481

原创 浅谈实际中遇到的关于移动端兼容性问题

浅谈实际中遇到的某些css属性在移动端兼容性问题w3cSchool中的css属性里对各种浏览器内核版本有相对比较详细的介绍,但是实际开发过程中,很多人应该不会真正关心是否支持,只有在测试的过程中,发现某些属性不支持时,又重新修改。而且在移动端的某些css属性的兼容性表现得和Pc端有些不一致。下面我将我在实际开发过程中遇到的一些问题整理如下:...

2020-07-12 16:16:24 491

原创 对金钱金额的处理--每三位间隔‘,‘,末尾保留两位小数

对金钱金额的处理–每三位间隔’,’,末尾保留两位小数由于项目的原因,最近遇到在下单时需要对金额进行特殊处理,我的需求是:当折扣不足0.01元时,不计入折扣。也就是这部分由客户自行承担。朋友给我分享了他们公司的coding,虽不满足我的需求,但是对金额的处理是每隔三位一个,,末尾保留两位小数,先mark一下:1 放在watch中housePrice (newVal) { newVal = newVal.substring(0, 18) let temp = [] temp = newVal

2020-07-07 23:26:45 749

原创 Nginx常用功能整理

Nginx学习笔记Nginx常用功能1.Http代理,反向代理(作为web服务器最常用的功能之一,尤其是反向代理)下面用张图来解释什么是正向代理与反向代理。Nginx在做反向代理时,提供性能稳定,并且能够提供配置灵活的转发功能。Nginx可以根据不同的正则匹配,采取不同的转发策略,比如图片文件结尾的走文件服务器,动态页面走web服务器,只要你正则写的没问题,又有相对应的服务器解决方案,你就可以随心所欲的玩。并且Nginx对返回结果进行错误页跳转,异常判断等。如果被分发的服务器存在异常,他可以将请求

2020-07-06 23:21:47 320

原创 限制只能输入整数和小数,但是不能输入0/0.0/0.00

限制只能输入整数和小数,但是不能输入0/0.0/0.00最近的项目中,有个涉及到类似与优惠买单的功能,在前端输入买单金额,并提交给后端。但是要求能输入整数或小数,但是不能输入0或0.0/或0.00这类数字。解决方案一般这种采用正则简单快捷/^([1-9]\d*./?|0.[1-9]|0.[0-9][1-9])\d*$/eg:let inputRules = function(val) { let reg = /^([1-9]\d*./?|0.[1-9]|0.[0-9][1-9])\d*$/

2020-07-04 23:52:27 2094 4

原创 将已写好页面的px转化为rem(px to rem)

将已写好页面的px转化为rem(px to rem)1.px/rem单位px :pixel的缩写,像素的意思rem : 是一个相对单位,1rem等于根元素的font-size值2.为什么要实现px to rem?移动端布局有两种:流式布局和rem布局其中,rem布局的原理就是页面中的元素采用rem作为尺寸或者间距的单位,由于我们平时都是以px(像素)为单位,所以我们就得px转rem3.工具类插件的作用是 自动将vue项目中的px转换为rem 。postcss-plugin-px2rem官方

2020-06-16 20:27:04 7188

原创 VUE实现局部刷新

VUE实现局部刷新可以使用2.2.0 新增的provide / inject控制的显示隐藏在App.vue文件中添加以下coding:<div id="app"> <router-view v-if="isRouterAlive"/></div><script> export default { name: 'App', data () { return { isRouterAlive: true } }, p

2020-06-16 19:56:38 640

转载 swiper只有一张图片时不轮播

swiper只有一张图片时不轮播<template><div class="banner"><swiper :options="swiperOption" v-if="showSwiper"><!-- slides --><swiper-slide v-for="item of list" :key="item.id"><img class="banner-img" :src="item.imgUrl"></swip

2020-06-06 12:18:52 4333

原创 控制台报错信息: e.nodeName.toLowerCase is not a function

控制台的报错信息: Uncaught TypeError: e.nodeName.toLowerCase is not a function问题原因:声明了一个名为nodeNamde的变量,导致变量名与jquery的一个方法属性重名导致的。var nodeName = ....问题排查过程:由于该代码是公司某后端人员写的,一开始并没有意识到问题的根本原因。走的是前端问题排查的正常流程。打印-删除相关js代码;最终将页面的js删完了,还是没找到问题的根本原因,不过差不多定位到哪些代码会导致这个问题。

2020-06-05 20:53:26 2371 1

转载 vue父子组件之间的传值

vue父子组件之间的传值

2020-05-27 20:42:13 397

原创 不固定宽高的小盒子在固定宽高的大盒子左右垂直居中

不固定宽高的小盒子在固定宽高的大盒子上下垂直居中移动端项目中经常会遇到一些类似的需求,例如:logo的展示,banner图等。一般情况下有以下几种方式:1.flex布局 (在安卓6,ios8以下系统不兼容)2.定位(推荐)定位问题记住口诀: 子绝父相<div class="father"> <img class="child" src="./logo.png" /></div>.father { width: 140px; height: 140p

2020-05-27 00:27:49 239

原创 文本一行展示溢出用...表示

文本一行展示溢出用’…'表示在实际开发中,会经常遇到需要在一行展示文本信息,溢出的部分用’…'表示。这个其实很简单的。只要用给该元素加上以下属性即可。 display: inline-block; // 转成行内块 overflow: hidden; width: 100px; // 宽度必设 word-break: keep-all; white-space: nowrap; // 一行展示 text-overflow: ellipsis; //溢

2020-05-26 19:46:36 592

原创 数组或字符串的几种判空方式

数组或字符串的几种判空方式js中常见的判空就是字符串或数组的判空了,尤其是前端,一般拿到后端数据,尤其是数组,在对数组进行一些操作(如map,filter等)时最好先判空下,以防是空导致js报错。1.数组空数组的判空是最常见的,空数组可以理解成 new Array(),相当于声明了一个新的空数组,程序会自动在堆中开辟一块空间。需要注意的是,它与var a = [] 生成的内存空间不是同一块,所以不相等。1.1 arr.lengthlet arr = [];if (arr.length == 0)

2020-05-26 01:25:21 3915

原创 解决浮层穿透问题

解决浮层穿透问题在实际开发过程中,经常会遇到这样的要求:在一个列表的上方,弹起一个浮层,弹起浮层后列表就不能再滑动,关闭浮层后,列表又能正常滑动。这个问题其实不难,我们只需要禁用浏览的冒泡和捕获事件即可。涉及以下两个函数:1.滑动禁止stop () { var mo = function(e) { e.preventDefault() } document.body.style.overflow = 'hidden' document.addEventListener('touchm

2020-05-22 20:45:39 327

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除