自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

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

原创 echarts y轴滚动(react版本)

效果图如下,代码见下方。

2024-09-25 11:26:13 363

原创 react+customize-cra使用less+less-loader时,可能遇到的问题及解决办法

链接如下modules: {},},},},})

2024-06-29 13:04:19 790

原创 react+video.js h5自定义视频暂停图标

注意:videojs升级后,不能用extend创建组件,需要按下方代码建一个组件。

2023-11-16 14:06:56 1327

原创 make alias work with customize-cra in ionic项目

ionic alias customize-cra

2022-12-18 20:01:56 277 1

原创 cra: addlessloader 配置报错解决方案(create-react-app)

报错1:Less LoaderLess Loader has been initialized using an options object that does not match the API schema. - options has an unknown property 'localIdentName'. These properties are valid: object { lessOptions?, additionalData?, sourceMap?, webpackImporte

2022-05-25 11:54:49 1903 19

原创 前端 mock 接口响应数据

前端mock数据

2022-03-30 16:26:32 2081

原创 antd-mobile DatePickervView封装按日按月组件(TS版本)

用到前端语言:antd-mobile,react,typescript,less效果:可按月,按时间段筛选列表。时间选择组件接收month,startTime,endTime三个字段,type类型为stringonClose方法,点击取消的事件onOk方法,点击确定的事件效果图:页面代码import { Button, DatePickerView, } from 'antd-mobile'import dayjs from 'dayjs'import React, { use

2022-03-22 10:08:54 2706

原创 OpenLayers案例-我的理解 01-24

目录1. 可键盘操作的地图,Accessible Map2.矢量平铺层,Advanced Mapbox Vector Tiles3.视图定位,Advanced View Positioning4.动态GIF,Animated GIF5.ArcGIS服务获取Feature对象,ArcGIS REST Feature Service6.ArcGIS显示512*512平铺,ArcGIS REST with 512x512 Tiles7.版权归属,Attributions8.波段对.

2022-03-17 17:41:14 2247 2

原创 解决vue中动态设置元素背景,背景不显示的问题

背景图片定义声明的地方,就要用require引用,而不是在赋值的地方。如下图解释 data() { return { testArray: [ { name: 'test1', id: 1, key: 1, isClicked: false, url: require('../images/bg-test1.png'), //此处就要用require引入,而不是在赋值

2021-09-17 15:55:21 1461

原创 火狐浏览器-滚动条样式的处理

一、一般情况下的解决方法不修改~二、简单而相对敷衍的方法(个人比较喜欢这种方法):改滚动条宽度,滚动条滚轮,滚动条轨道颜色,此方法细节上需要优化//设置滚动条的宽度,针对所有浏览器//此属性值包括(auto,inherit,initial,none,revert,thin,unset)//只有thin值才会改变滚动条的视觉宽度,此值等于8像素scrollbar-width: thin;//设置滚动条的颜色,针对所有浏览器//顺序为 滚轮颜色 轨道颜色scrollbar-co

2021-03-10 17:20:34 4159

原创 2020-10-24-选中input框,隐藏输入法键盘

终端特点:1、类似诺基亚的机皇款,本身带硬件键盘;2、屏幕小,输入法的键盘展示会遮挡屏幕,隐藏使用体验。需求:1、进入页面,输入框自动聚焦;2、隐藏输入法键盘,用设备自带的键盘type。网上两种方法:1、加readonly,此方法不能type,只能看,不适合我的业务场景。<input type="text" readonly />2、此方法,我这边测试,在手机和终端设备上,虽然不弹出键盘,但是既不能type,也没有焦点。$("#box").focus(funct

2020-10-24 14:04:26 1009 2

原创 react动态子路由不触发componentDidMount生命周期的解决

目录应用场景为什么不用子组件代替子路由不触发生命周期原因解决方法应用场景适用于列表页样式和交互相同,列表页只需根据tab的不同id调用对应列表的情况。比如下图为什么不用子组件代替子路由业务需要不同的tab对应不同的链接,链接可以分享给其他人直接查看。不触发生命周期原因componnetDidMount是在页面初次加载渲染的时候触发,而父路由改变tab时,列表页子路由组件已经渲染了,所以不会触发。解决方法父组件引用子路由时,给子路由的渲染组件加一个key即可

2020-06-28 16:46:33 3920

原创 小程序getUnlimited生成二维码与提交审核前的调试

目录官网链接postman请求官网接口地址:页面的js处理微信开发工具:官网链接https://developers.weixin.qq.com/miniprogram/dev/api-backend/open-api/qr-code/wxacode.getUnlimited.htmlpostman请求官网接口地址:https://api.weixin.qq.com/wxa/getwxacodeunlimit?access_token=ACCESS_TOKENsc.

2020-06-20 11:16:20 2218

原创 正则收集

1.手机号/^(13[0-9]|14[579]|15[0-3,5-9]|16[5,6]|17[0135678]|18[0-9]|19[189])\d{8}$/2.邮箱/^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+(.[a-zA-Z0-9_-])+/3.ip地址/^((2(5[0-5]|[0-4]\d))|[0-1]?\d{1,2})(\.((2(5[0-5]|[0-4]\d))|[0-1]?\d{1,2})){3}$/4.mac地址/^[A-Fa-

2020-05-30 11:15:23 195

原创 微信小程序使用npm方式增加jsencrypt rsa加密验证

目录一、npm安装jsencrypt二、微信小程序构建npm三、修改构建后的jsecnrypt文件四、使用jsencrypt进行rsa加密五、相关步骤的注意事项,下午更新一、npm安装jsencrypt1.cmd切换到小程序的目录2.执行npm init,按照具体情况在cmd里面填写相关的字段,之后小程序会多这两个文件3.执行mkdir node_modules,创建node_modules文件夹4.npm install jsencrypt,安装jsencryp

2020-05-19 12:07:55 7090 1

原创 微信小程序clearInterval(清除定时器)不生效

微信小程序的定时器清除不生效?自己把定义的定时器变量(我的是timer)赋值为null就好了。//定义定时器setTimer() { let self = this; self.timer = setInterval(() => { self.doSomething(); }, 1000);},//清除定时器clearTimer() { clearInterval(this.timer);//如果发现这个clearInterval不生效,写

2020-05-12 16:00:06 2989

原创 windows--novnc 在浏览器中打开并控制远程屏幕

https://github.com/molleahahs/novnc-browsergit项目地址readme.md中带有详细描述此博客再描述一遍,嘻嘻。。。场景:电脑A想实现通过一个网址,在浏览器中远程电脑B,查看和操作电脑B里面的东西准备工作:(注意:不要将电脑A和电脑B搞混啦,我这下面的描述大部分都是针对电脑B,也就是那个被操作的电脑。)1.两台电脑A,B,不要用自...

2020-04-25 17:43:21 2015 4

原创 windows--realvnc server的安装配置

目录1.电脑A下载vnc viewer,安装,这个没有特别的注意点,跟普通软件一样。2.电脑B下载vnc server,安装,电脑B---vnc server的配置在第三步之后进行,先安装吧。3.在realvnc用邮箱注册一个账号,这一步很重要哦!这个账号用于登录vnc server的。注意:进入到下面这张图How to start your trial后,一定要选择Enterpr...

2020-04-25 16:59:03 12513

原创 开机出现efi shell解决

解决方法:电脑关机,放一会儿,自动就好了。前提是,电脑小白,以前或者现在没改过bois配置,我相信大部分都不会无聊到改bois配置。实际情况,我用手机找问题解决方法加上在电脑上试着解决,大概花了30多分钟吧。所以,出现这个问题,就把电脑晾一边,放30多分钟,具体估计因电脑而异。问题背景:打开,关闭,操作电脑软件太快了,具体有模拟器,网页,android studio,其实和平时相比...

2020-04-05 15:18:29 35943 1

原创 element组件cascader动态设置选择值

开发时遇到的问题描述,解决方法,心路历程。问题描述:动态设置cascader的取值,发现输入框正确了,但是展开的弹层样式选中有问题见图解释,数据来源于官网:下图是页面初始化时的默认值现在项目场景是需要在js里动态改变cascader的选择值,比如,让级联选择器选中组件》Data》Tag标签:<el-form-item label="选择" prop="treeV...

2020-04-03 23:08:35 6814 2

原创 微信小程序-子组件定时器的定义和销毁

应用场景:1.多个页面需要定时器2.并且定时器到0时需要执行什么操作销毁定时器的场景:1.父页面正常返回时;(onUnload--监听页面卸载)2.父页面跳转到其他页面时;(onUnload--监听页面卸载)3.父页面自身需要销毁定时器然后进行其他操作;(执行定时器组件的清空定时器操作)4.定时器页面自身倒计时结束时;(clearInterval)具体,见下方代码和...

2020-03-26 12:06:46 4013

原创 混合开发入门,java jdk和android sdk安装配置+模拟器安装配置+android studio运行起项目--windows电脑

首先分享我安装配置过程中遇到的坑,如果你也遇到了,那么跟着我的安装步骤,或许就没问题了...1.jdk安装过程中没有提示安装jre,jdk的安装目录下面也没有jre文件夹2.java不是内部或外部命令...3.SDK Manager以命令行的模式一闪而过,然后就没有然后了...下面开始正式的安装配置步骤一.下载jdk安装,我的是windows,所以我下载的windows版本的...

2020-03-21 13:11:51 602

原创 rem适配

本文由三部分构成:实战部分+原理+参考网址实战部分实战设置:1rem = 100px实战代码:下方代码适应绝大多数移动端网页(至于对scale的处理,以后看懂了再补充)(function (doc, win) { var docEl = doc.documentElement, resizeEvt = 'orientationchange' in window ...

2020-03-10 11:24:07 431

原创 微信小程序editor上传图片转化为base64格式

先敬上关键代码const imgUrl = 'data:image/png;base64,' + wx.arrayBufferToBase64(wx.getFileSystemManager().readFileSync(tempFilePaths));再敬上完整代码加详细解释//此事件为点击图片按钮上传的事件insertImage() { const that = th...

2020-03-09 10:36:33 852

原创 微信小程序 indexOf的替换方法

方法:通过wxs定义indexOf方法,在页面中引用并使用栗子:wxs:命名为str.wxs,导出定义的defineIndexOf方法,命名为indexOffunction defineIndexOf(str, val) { return str.indexOf(val);}module.exports = { indexOf: defineIndexOf}wxm...

2020-01-12 10:10:52 2345

原创 vue+axios+element导入excel

总结:type类型是file的input框上传的文件,都可以用formData对象上传,我的代码很简单,非常简单,very简单,没有网上的复杂,所以分享出来,供大家参考。1.接口部分注意点1:必须设置headers的content-type为multipart/form-data,不然后台会报the current request is not multipart request注意点...

2019-11-22 16:08:55 781

原创 vue+axios+blob导出excel---提示文件损坏解决

1.接口部分注意点1:此处直接resolve(response),而不是(response.data),因为数据处理部分需要拿到后端放在header里面的文件名fileName注意点2:需要写responseType: 'blob',而且位置放在data同级的对象里,如下图,不然下载后的文件打不开,提示文件损坏export const apiExportCusGroup = para...

2019-11-21 10:58:25 14788

原创 微信小程序-----取经之路(我的微信小程序大全)

此博文不定期更新中,收集小程序开发过程中的一些有意思的部分。目录1.公共组件import与template的使用2.checkbox样式自定义之类名的查找3.动态class4.动态style5.app.css在自定义组件不生效6.事件传参,例如bindTab7.关于全局路由拦截8.关于隐藏小程序navigationBar的返回按钮9.关于嵌套循环,自定义fo...

2019-09-16 11:00:40 292

原创 react验证码倒计时

本文由两部分组成,思路和代码思路:1.运用componentWillReceiveProps方法的监听props改变的功能,2.这里倒计时要用setTimeout,不能用setInterval。代码:componentWillReceiveProps(next){ //短信验证码倒计时 if(next.isTimerStart && next.tim...

2019-09-12 17:19:32 402

原创 vue-配置外部网址变量--避免重复打包

此文档主要为4步代码组成通过这篇博文你能学到:one:怎么配置外部变量避免重复打包,two:生产环境和开发环境共用一个接口文件,不用创建三个文件index.js,index_dev.js,index_pro.jsthree:开发环境跨域配置开始:1.index.html,引入外部变量配置文件(paramConfig.js),此文件在第二步会创建<script s...

2019-09-06 10:55:16 401 2

原创 vue中使用video-js--随机滚动的文字

开头就赠送福利的博主,哈哈哈,这是我看了很久官网,翻了很多博客才找到的大佬网址,笑纳https://www.cnblogs.com/afrog/p/6689179.html目录你能从这篇博文学到的:博客背景:正文代码,(js,css,html)这是浓缩的精华,建议复制了看一看:code关键代码详解:总结:你能从这篇博文学到的:1.vue中定时器的使用2.vue中...

2019-08-30 09:57:12 2667 5

原创 videojs使用心得

这篇博文主要包括四个部分:目录一、基本使用:二、显示隐藏自己需要的videojs控制栏按钮三、改写video原生组件,比如(PlaybackRateMenuButton)四、自定义video组件,比如(视频中随机位置滚动的文字)一、基本使用:参考网址:https://videojs.com/getting-started/第1步:引用css和js<hea...

2019-08-19 11:29:43 5834 6

原创 antd-mobile之listview结合react-redux的使用,带例子,带图

这个插件给我最大的体会是,官网看不懂的,把官网的例子复制到自己项目中,然后修改成自己的代码,慢慢来就懂了。。。。首先解释一下官网例1:自定义容器中各参数和方法的作用MyBody():这个方法是自定义滚动的范围是整个body滚动还是在你自定义的层里面滚动(个人认为可以用css的相对定位,绝对定位,overflow来实现同样的效果,所以这个方法看喜好来。);变量data:循环展示的数据集(如...

2019-08-13 18:10:14 1370 9

原创 react-BrowserRouter-nginx-二级目录配置

我的域名假设是http://www.abc.cn,二级目录是wsp;前端两步:第一步:package.json下加homepage字段: 正确写法:"homepage": "http://www.abc.cn/wsp/", 注意:这里一定要是绝对路径,我网上找了好多都是 方案1:"homepage": "." 方案2:"homepage": "./" ...

2019-07-18 11:50:54 6336 4

原创 vue-video-player禁止右键点击

<div @contextmenu.prevent="menuPlayer()"> <video-player id="videomad" class="vjs-custom-skin" ref="videomad" :options="playerOptions"> </video-player></div>禁止右键功能...

2019-05-24 14:37:20 3573 12

原创 ie7,8兼容大全,不定期更新中...

啦啦啦,都是我工作中遇到的问题,所以把解决方法整理一下,都是网上搜的,嘻嘻嘻。1.轮播:swiper2支持ie7,8的轮播插件,你的不二选择! ps:当有左右控制按钮,一页展示多个slider时,向左滑动会出现上一个滑块空白的情况 ps:滚动slider要大于等于4个,我试了3个不生效 解决方法,添加centeredSlides和loopAdditionalSlides...

2019-05-09 15:58:23 429

原创 以Sia-UI项目的文件组件为例参考阮一峰老师的react-redux入门教程对react-redux的用法总结

过一段时间后的批注:看了慕课网老师的react课程,这篇文章我推荐的链接还是值得看,但我对react的解释就不用看啦,因为部分理解还是不到位,而且没有对中间件的解释,但我是不会删除这个宝藏的,嘻嘻。阮一峰老师的文章链接:http://www.ruanyifeng.com/blog/2016/09/redux_tutorial_part_one_basic_usages.htmlSia-UI的...

2019-02-22 16:51:39 374

原创 angular1之ng-include和内部控制器的使用

外部页面<!DOCTYPE html> <html lang="zh" ng-app="myApp"> <head> <meta charset="UTF-8"> <link rel="shortcut icon" href="favicon.ico" /> <title>pagebounce...

2018-08-10 17:56:34 1162

原创 angular1中swipe滑动的使用

效果图:完整代码:<!DOCTYPE html><html lang="en" ng-app="myApp" ><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> &...

2018-08-10 10:45:23 1732 2

原创 angular1自定义指令模拟ng-material的输入框效果

效果图:完整代码:<!DOCTYPE html> <html lang="zh" ng-app="myApp"> <head> <meta charset="UTF-8"> <link rel="shortcut icon" href="favicon.ico" /> <title&gt...

2018-08-07 15:25:04 391

空空如也

空空如也

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

TA关注的人

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