自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+

素钗一生推

前端大门踏入了一只脚。。。

  • 博客(75)
  • 资源 (4)
  • 收藏
  • 关注

原创 Mysql8.0 忘记密码且找回密码后引起的后遗症

Mysql8.0 忘记了密码,在操作数据库或表时,报错编码1449,没有权限时,处理步骤

2022-10-17 19:36:25 444

原创 mysql数据库基操所遇问题及相关知识及命令记录

命令行操作sql乱码问题,问题一般出现在的5.几的版本上,8.0是utf8 - 4字符的登录并查看数据库创建数据库并建表并插入数据删除数据库

2022-09-21 22:21:42 330

原创 win10系统下安装与使用mysql8.0版本所遇到的问题及常用命令记录

1.2 输入mysqld --initialize --console命令运行,完毕后,记下加密后的初始密码(password同一行冒号后的那一段字符)3.2 命令行 -- cmd 输入 net start mysql(服务名) 来开启,输入 net stop mysql来关闭服务。1.5 输入 mysql -u root -p 后,提示输入密码,请将1.2这个步骤中的加密字符输入。3.1 我的(此)电脑 - 管理 - 服务 - MySQL - 调整对应项即可。4.3 图形化的一些工具。

2022-09-20 21:21:52 709

原创 微前端qiankun项目实践系统-初始化

微前端qiankun框架的实践,配置的处理,碰到的问题

2022-05-10 17:58:28 352

原创 双向滑动区间选择控件

如题所示,仿瓜子二手车双向滑动选择器,主要特点是:双向滑动,可点击进度条定位,滑块可拖动,数值变化有提示动画效果图如下:效果简约,有需要可下载资源。。。资源开箱即用,基于vue.js,代码封装性不高...

2022-01-20 20:12:27 676 6

原创 input输入数字且有长度限制的兼容方案

在使用表单元素的时候,input输入框是很常见的,在输入手机号等只需使用数字并且对输入长度有需求的时候,就会发现,input本身所具有的属性真是太令人又爱又恨了,哈哈哈!只输入数字时,你可能会想,让input的类型为number不就好了吗?是呀,可惜,ios不怎么听话,需要限制长度时,你可能又会想,input不是有个maxlength属性吗?有啊,但当type=number的时候,各个系统都很叛逆,都跟你对着干,这个时候,你会想什么呢?再进一步思考的时候,限制长度的时候,有空格怎么办呢?如果是复制粘..

2021-11-15 20:51:16 1898

原创 Vue.js在同一个页面重复引用相同组件时的干扰处理

如标题所说,我们在使用vue.js组件时,会出现在同一个页面会多次使用相同的组件,更特别的是,组件相同,但数据呈现上是完全不同的,有增或有减,但dom交互的处理是一样的,在这样的背景下,有可能引起组件数据跟需求不一致,交互无法运行等问题,这两个问题是比较常见的,由 于组件在初始化时,是共用的作用域,因此,变量数据是一致的,另外一个问题是因此,大部份的情况下,交互编写可能都会考虑到dom元素的选取问题,如果组件中出现多个相同的id,那交互上会出问题,也不足为奇了。为了解决如上的问题,我们编写组件的时候,需要

2021-10-29 23:14:48 11270 3

原创 单页应用移动端弹窗穿透解决终极方案

移动端的web项目,大多数会采用单页应用来实现,在布局上也有一定的讲究,从设计角度出发的话,布局大致分为两类,一类是单页全屏,另外一种是内容多的滚动屏。全屏的话,一般布局会采用vh,position等等方式来实现,而滚动屏又会分为两小类,一类是局部滚动,另外一类是全局滚动,一旦页面出现滚动条,并且此页面有弹窗的需求时,穿透这个问题就来了。一句话总结穿透就是:弹层下的页面滚动会跟随着弹窗的滚动。要解决这个问题,有很多种方案,尤其是在移动端,比如说,设置overflow:hidden,positio...

2021-08-01 17:07:44 305

原创 小程序车型选择器组件

如题所示,实现小程序页面车型选择组件,主要特点为数据是服务器加载的,仿微信联系人右侧导航实现定位,可搜索对应列表,点击标题可切换数据结构为普通的数组对象,前端需要编写方法处理成适合界面显示的数据结构,在选择品牌的时候,右侧导航主要代码如下...

2020-12-15 15:23:17 1220 23

原创 对象数组分组

如图所示,有些对象数组需要进行分组显示,比较常见的功能,类似微信通信录的字母选择交互,这里的数据结构就是需要进行分组处理的,还有车牌车型关联选择等,这些都是需要转换的,抽取方法如下,传入三个参数,arr:原始数组 gk:分组依据字段,ok:处理完需要呈现的对象键值代码如下handleGroup (arr, gk, ok) { var obj = {}, list = []; for (var i = 0; i < arr.length;...

2020-08-31 11:34:57 1148

原创 canvas编写扇形比例图

涉及知识点有canvas在移动端的适配及清晰度调整,画还是非常简单的效果如图大概的思路是:canvas的width及height使用rem作单位来实现适配,当然也可以通过屏幕计算比例来设置宽高另外一个点是,上图是由两个圆堆叠而成的,中间的文字也是利用canvas画出来的具体代码如下:// 画环 drawMulCircle (canvas_id, proportion,total) { var canvas = document.getElement

2020-08-24 21:44:15 691 1

原创 js + css3 + vue.js 实现仿input输入框功能

单纯只做H5相关的开发时,有些比较特殊的情况,比如说需要弹出自定义键盘的同时不希望弹出设备软键盘但是它的交互又希望是跟输入框保持一致,这种,可以通过横批输入框来实现,基于vue.js双向绑定的原理下,这个功能还是很容易的。<template> <div class="pi-wrap"> <div class="pnif-input"> <input class="pi-placeholder" plac

2020-08-09 16:53:16 536

原创 vue.js 带有正则选择的车牌控件组件

此控件是用于微信相关的应用中,主要是对于车牌号的选择范围作了一定的正则匹配,选择时,字体会放大,键盘是动态变化的,效果如下两张截图:代码以资源的形式上传,有需要可以留言!...

2020-08-09 16:31:43 1151 16

原创 git操作之本地项目转移

如题所示,将旧项目迁移到新的项目上操作如下:本地查看旧项目的源git remote -v可看远程旧源git remote rename origin newName重命名本地源git remote add origin新源地址 拉取新的源git push origin --all推送...

2020-05-08 17:18:20 318

原创 企业微信H5踩坑指南

企业微信开发H5功能,正在进行中,需要记录的点有两个:第一是:域名验证,针对SPA应用,下载下来的验证文件跟index.html同一目录或者使用其他方式,需要保证域名+文件名可以访问即可,再次登录微信后台勾选即可第二是:企业微信jssdk授权,建议下载文件放到本地,再引入至index.html页面中,因为它有要求在app.vue监听路由即可,当然,有些api调用是有次数限制的,因此,还是...

2020-05-08 17:00:34 1319 2

原创 微信小程序踩坑指南--回填再造

一写小程序前端深入坑,踩着问题的‘尸体’爬了上来。奋斗一个多月,需求,设计,前端一体成型的项目终于上线,特此总结一下,以示激励。。。说到小程序的坑,第一个想要吐槽的就是它的api文档,分区也太‘微信’了吧,找到这个再跳到某个,感觉找个文档还挺费时间的,需要多点耐心,多点爱心。第二个想说的点是:app.js与page.js的生命周期是同步的,因此,如果你想在页面加载之前做点异步加载有关的...

2020-05-08 15:42:59 385

原创 前后端分离开发之微信小程序登录及内部授权

诚然如题所言,微信小程序登录可以让开发者快速地获取微信提供的用户身份标识,跟开发者构建的内部用户体系产生关联,在这个过程中,小程序如何登录及前端跟后台的授权验证体系如何打交道呢,现在就一步一步来了解清楚吧先来看一下微信官方提供的小程序登录流程图这些内容跟前端有关系的是wx.login获取code,发送code,存储登录状态这三者,一般情况下,前端与后端相联接的授权体系,每个公司都其...

2020-03-08 18:34:25 2577

原创 一维数组变有规律二维数组

布局写多了,总会踩上几个坑,面对有奇偶需求的布局而服务端数据只返回一维数组列表时,flex布局帮不上忙的时候,有没有一种抓耳挠腮的感觉呢!这种状态下,前端就得发挥一下啦!来看一下何谓奇偶布局吧!图片有点难看,将就着看,能理解就行啦,毕竟是截图工具画的~~~如图所示,类似这种结构,如果使用flex来布局,那需要好好想想,对吧!那就换一种思路,布局不直接,那就改数据结构呗!如...

2020-03-07 17:46:51 302

原创 vue.js实现手风琴效果

效果如图,标题可定制,自定义内容区,默认打开项可以配置,主要利用了vuejs父子组件中的uid来实现,打开一个,关闭其他的,主要实现代码如下:// collapse.vue<template> <div class="collapse-parent"> <slot></slot> </div>&...

2019-12-25 16:28:23 1385 1

原创 前后端分离项目之微信端网页授权处理

在微信公众号中内嵌H5网页,在需要获取用户信息或者需要用到微信公众号开发相匹配的api时,需要拉取微信授权,在非前后端分离的项目中,这部分是由服务端一并完成的,在前后端分离的项目中,根据微信公众号开发者文档,也可以很清楚地知道,拉取授取处理逻辑中最重要的一点就是,先获取code跟state,再根据取到的值发起授权请求,在前后端分离的项目中,最核心的一点是,构建一个授权中转页,需要授权的路由在判断没...

2019-12-25 14:09:33 2220

原创 移动端元素拖拽之touchstart, touchmove,touchend简易版本

!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-C...

2019-12-17 21:25:38 182

原创 macOs快速查找nginx相关文件路径命令

快速调出对应文件放置路径iTerm =>输入nginx -V => cd即可也可以使用brew info nginx

2019-12-10 10:17:04 886

原创 canvas实现类流星雨滴效果

如图所示的效果,代码如下<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <met...

2019-11-05 15:33:20 374

原创 前端面试题集锦四

41.route和router的区别是什么?答:route是“路由信息对象”,包括path,params,hash,query,fullPath,matched,name等路由信息参数router是“路由实例对象”,包括了路由的跳转方法(push、replace),钩子函数等42.vue组件中写 name 选项有什么作用?答:项目使用 keep-alive 时,可搭配组...

2019-11-05 15:25:34 105

原创 前端面试题集锦三

36.实现new方法答:步骤:创建空对象,链接到原型,绑定this,返回新对象function CreateNew () { let obj = {}; let constructor = [].shift.call(arguments); obj._proto_ = constructor.prototype; let result = constructor.app...

2019-11-05 15:13:33 117

原创 前端面试题集锦二

23.判断javascript的方式答:23.1 typeof 只可以判断出 string, number,boolean, undefined,symbol,因为null, array,object的结果都为object23.2 instanceof 构造函数的prototype属性是否出现在对象的原型链中的任何位置23.3 Object.prototype.toString....

2019-11-05 14:50:57 112

原创 前端面试题集锦系列一

1.常用的浏览器有哪些?它们的内核分别是什么?答:(1) Trident内核: IE, 360,搜狗,TT (2) Gecko内核: Netscape6及以上版本,Mozilla Firefox (3) Presto内核: Opera7及以上 (4) Webkit内核:Safari, Chrome (Blink为Webkit的分支)2.一...

2019-11-05 14:45:53 147

原创 移动端可以拖拽的倒计时

如题所示,编写一个或者多个可拖拽的倒计时功能,包括边界判定,目标命中等功能模块……思路还是蛮简单的<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>www.jb51.net js倒计时</title> <style...

2019-10-29 18:22:25 163

原创 javascript 知识回顾

1.document.write和innerHTML的区别解析:document.write为整体页面重绘,innerHTML为节点赋值2.通过window.navigator.userAgent来检测浏览器类型3.数据类型相关的趣的表达式typeof null :objecttypeof undefined: undefinedtypeof NaN: NaNalert(NaN=...

2019-09-05 16:16:04 104

原创 13道有些意思的Javascript题

1.["1", "2", "3"].map(parseInt)的运行结果答案:[1, NaN, NaN]解析:parseInt(string, radix)radix介于2~36或者0,map会给callbackfunc传递三个参数,parseInt()接收map传递的前两个参数,运行过程如下:(1,0) => 1(2,1) => NaN(3,2)=> NaN //...

2019-09-04 22:56:55 384

原创 微信小程序定制页面局部上拉刷新及加载列表

如标题所示,由于微信小程序目前仅支持整体页面刷新及加载,有某些具体特殊需求的页面中是无法满足的,因此有了定制化的局部下拉刷新及上拉加载列表,思路如下:下拉刷新会有5种状态嘛:reset:重置初始状态pulling:下拉过程pullEnough:下拉距离判断refreshing:释放正在刷新refreshed:刷新完成有了这些状态之后,再考虑在微信小程序当中,局...

2019-07-31 23:57:00 2849

原创 微信小程序之自定义导航

小程序中的页面导航是可以自定义的,一般情况下,自定义导航跟页面转发的按钮并排的话,页面相对整齐好看一些,如下图所示的效果这种自定义导航也不复杂,首先理解好如下4点:1.转发按钮是固定宽高的,高度为32px2.小程序页面需要自定义导航时,需先在对应目录下设置.json配置文件3.状态栏的高度,及页面其他元素布局或者有下拉刷新的情况时,需要根据具体情况去处理样式等问题4.抽取为...

2019-07-24 16:56:01 8467

原创 微信小程序如何引用iconfont

更正:目前iconfont的本地文件在小程序中已得到支持,只需将iconfont.css改成.wxss后缀即可使用如题所示,微信小程序中不支持iconfont的正常引用的,因此,得找些窍门,方案有四,当然其三是引用其他大佬的,https://blog.csdn.net/hdchangchang/article/details/83511007,在这边就不写了,有兴趣的可以查看链接,说说...

2019-07-23 15:35:59 1082

原创 Promise最简解析

Promise:n. 许诺,允诺;希望 vt. 允诺,许诺;给人以…的指望或希望 vi. 许诺;有指望,有前途The Promise object is used for asynchronous computations. A Promise represents a single asynchronous operation that hasn't completed yet, b...

2019-06-24 09:45:01 219

原创 简约风解析 javascript 原型及原型链

一般情况下,javascript中万物皆对象,它有两大类数据类型:值类型(基本类型):字符串(String)、数字(Number)、布尔(Boolean)、对空(Null)、未定义(Undefined)、Symbol。引用数据类型:对象(Object)、数组(Array)、函数(Function)js定义的变量,均为对象,它自身拥有_proto_这个指针,它指向构造它的对象的对象的pr...

2019-06-14 16:43:59 96

原创 new Date两个实用小方法,即获取最近几天及某段时间内的所有天数

js Date 对象用于处理日期和时间的,Date 对象会自动把当前日期和时间保存为其初始值,即console.log(new Date()) //VM108:1 Tue Jun 04 2019 21:14:48 GMT+0800 (中国标准时间)经常使用的方法有:getDate():从 Date 对象返回一个月中的某一天 (1 ~ 31)getDay():从 Date 对象返回...

2019-06-04 21:22:42 1303

原创 URI解析

URI: Uniform Resource Identifer统一资源标识符特指在计算机用语中,一个用于标识某一互联网资源名称的字符串它的格式一般如下:协议(访问资源的命名机制)主机IP地址(存放资源的主机名)资源存放的具体地址,包括目录和文件(资源自身的名称,由路径表)URI解析:“解析”一个URI意味着将一个相对URI引用转换为绝对形式,或者通过尝试获取一个可解引URI...

2019-05-24 14:57:18 1575

原创 移动端web页面图片呈现方式

移动端web页面,涉及到图片,都是需要去考虑图片的适配的,一般原则是定宽不定高,定高不定宽,图片按照一个规则来,要么按高度100%,宽度自适应。要么宽度100%,高度自适应.实际操作中,直接设置如下样式,基本可以解决图片变形的问题max-width:100% !important;max-height:100% !important;更进一步,如果需要图片在某个区域垂直居中显示...

2019-05-21 17:33:26 1956

原创 无限加载列表与搜索框结合的bug

此bug的产生是基本vant框架下,使用van-list构建长列表并且在长列表当中存在搜索功能的页面,而搜索页面是另外一个组件而形成的vant当中的van-list无限加载列表在实际运用中,html结构构成原则为,外部overflow:hidden,内部形成滚动区域即可,具体样式自行思考,如果是在vue-cli项目中使用,列表内容是动态加载的情况下,在组件的mounted生命周期内,需要手动...

2019-05-08 11:06:14 751

原创 javascript正则截取,替换字符串

温馨提示:(开发过程没有发现坑,打包竟然报错了,无语.jpg)此篇文章末尾提到的例子当中使用的(?<=exp),零宽度正回顾后发断言,在vue-cli项目当中,运行不会报错,但进入编译打包会报错如下:Invalid regular expression: /(?<=src=").*?(?=(">))/: Invalid group ,请自行使用?=替换或者根据个人需求进行适度...

2019-05-06 14:59:58 1777

vue.js版双向滑动区间选择器

1.优化移动端输入范围时的各种奇怪的兼容性问题,提升用户体验 2.资源包注释详细,逻辑简单 3.有助于掌握方法论,受益良久 4.使用简单,参数简单 5.交互符合移动端操作习惯

2022-01-20

只调数字键盘且限制长度及粘贴处理.rar

input输入数字且有长度限制的兼容方案

2021-11-15

微信小程序之车型选择器组件

微信小程序车型控件选择器,支持搜索,动态加载数据,仿微信联系人导航操作,暂未实现滑动匹配,后期加上,标题可静态切换

2020-12-15

PlateNo.rar

正则车牌组件,采用vue.js,主要应用于企业微信等h5应用中有选择车牌号码的功能,它的使用与其他vue.js应用组件一致

2020-08-09

空空如也

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

TA关注的人

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