- 博客(44)
- 收藏
- 关注
原创 element表单验证v-if显示后失效
在某些需求流程中,需要根据当前步骤显示不同的form表单数据,根据步骤修改对应的rule会出现blur验证失效的情况,只需要在el-form-item上添加key值即可。
2024-04-09 15:15:37
192
原创 vue中electron与vue通信(fs.existsSync is not a function解决方案)
dist/main.js (整个文件配置在另一条博客里)vue文件中。
2023-10-27 18:16:00
1295
3
原创 leaflet.js使用(底图选择)
leaflet.js使用leaflet.js官方文档底图可选择let url = 'http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png'; // open street map url = 'https://api.tiles.mapbox.com/v4/{id}/{z}/{x}/{y}.png?access_token=xxxxxx'; // map box url = 'http://tile.stamen.com/toner-li
2021-12-21 16:54:33
643
原创 echarts dataZoom卡顿
echarts dataZoom卡顿echarts有个关于datazoom的隐藏bug,当x轴的type为time时,datazoom拖动会卡顿,只需要将series的showSymbol属性改成false,就可以了series: { showSymbol: false}
2021-12-03 17:05:01
1488
原创 MediaRecorder
mediarecorder是用来录制视屏的,详细文档:https://developer.mozilla.org/zh-CN/docs/Web/API/MediaRecorder/MediaRecorder语法:var mediaRecorder = new MediaRecorder(stream[, options]);参数:1、streamMediaStream 将要录制的流. 它可以是来自于使用 navigator.mediaDevices.getUserMedia() 创建的流或者来自
2021-05-18 17:42:28
504
原创 js邮箱正则表达式
const reg = /^([a-zA-Z0-9])+(([a-zA-Z0-9])|([._-][a-zA-Z0-9])*)+@([a-zA-Z0-9-])+((\.[a-zA-Z0-9-]{2,3}){1,2})$/;console.log(reg.test(test.xx@xx.com));
2021-04-22 15:04:34
1063
1
转载 H5网页扫码聚合支付——微信
一、通过拼接地址重定向的方式授权获取code拼接地址参数:redirect_uri:重定向地址。(注:重定向地址需要使用 urlEncode 对链接进行处理)appId:公众号的唯一标识。scope:授权方式。(注:snsapi_base (静默授权),snsapi_userinfo (弹出授权页面))response_type:返回类型,请填写code。(写死即可)#wechat_redirect:无论直接打开还是做页面302重定向时候,必须带此参数。拼接列子:如果静默授权,页面将跳转至
2021-04-01 14:52:06
749
转载 H5网页扫码聚合支付——支付宝
一、通过授权获取auth_code1、通过CDN方式引入支付宝jsapi<script src="https://gw.alipayobjects.com/as/g/h5-lib/alipayjsapi/3.1.1/alipayjsapi.min.js"></script>2、通过getAuthCodeAPI根据主动授权或静默授权获得auth_codeap.getAuthCode({ scopes: ['auth_user'], // 主动授权:auth_user,静
2021-04-01 13:39:32
1705
原创 v-html图片css设置无效
v-html图片css设置无效使用::v-deep::v-deep { img { width: 200px; }}
2020-09-28 17:55:32
362
2
原创 electron-vue使用
1、初始化项目vue init simulatedgreg/electron-vue ele-vue-first可能遇到的问题:解决方案:根据提示安装@vue/cli-init,但是我用yarn安装后发现还是不行,再用cnpm安装,就ok了cnpm i -g @vue/cli-init安装完重新运行初始化命令2、安装依赖,启动项目cnpm icnpm run dev可能遇到的问题:解决方案:找到根目录下的**.electron-vue**分别在webpack.ren
2020-08-20 16:44:01
215
原创 electron使用及打包
下载建议使用cnpm1、下载electroncnpm install electron -g2、下载运行官网demogit clone https://github.com/electron/electron-quick-startcd electron-quick-startcnpm installcnpm start结果如下:3、打包3.1 下载打包依赖cnpm install electron-packager -g3.2 配置(不配置cnpm打包会特别慢)在项目根目
2020-08-20 11:53:44
219
原创 Vue小知识
v-for设置唯一key;模板中的复杂逻辑使用计算属性代替;避免v-for与v-if混用;尽量使用私有属性/方法;组件数据必须是一个函数,并返回一个对象;为组件样式设置作用域;将复杂页面拆分成多个多个组件文件;prop应该尽量详细;组件名应该由多个单词组成;添加链接描述...
2020-06-28 15:37:30
124
原创 react scss全局变量配置
一、安装依赖npm install sass-resources-loader --save-dev二、修改配置修改 node_modules/react-scripts/config/webpack.config.js 如下图代码如下:.concat([{ loader: "sass-resources-loader", options: { resources: ...
2020-04-08 14:21:19
1122
转载 Element-ui 给el-select添加唯一class名,修改个别el-option样式
https://blog.csdn.net/Gomeer/article/details/103006704
2020-04-01 17:28:20
1556
原创 react代理
注:项目搭建使用的是create-react-app脚手架。(这篇文章,我是怀着无语的心情写的)。1. 脚手架版本低于2.0,可以直接在在package.json文件中使用proxy,使用对象类型"proxy":{ "/api":{ "target":"http://x.xx.com", "changeOrigin": true }, "/b...
2020-02-27 19:17:23
431
原创 React配置Sass
一、安装sass-loader和node-sass依赖npm install sass-loader node-sass --save-dev二、打开react的webpack配置node_modules/react-scripts/config/webpack.config.js找到module下的rules,oneOf数组在oneOf数组中添加以下对象{ ...
2020-02-27 15:20:19
399
原创 微信小程序改变对象属性
在微信小程序里,改变数据需要用setData方法,改变对象如下: this.setData({ obj: {'a':'haha','b':'heihei'} })那如果只是想改变的某一个属性值呢,方法有两种:先用一个变量,接收对象的属性值,再使用setData方法改变 let a = this.data.obj['a']; this.setData({ ...
2019-09-28 14:10:45
1047
原创 JS数组去重——终极版(多维,复杂类型皆可)
闲话不多说,直接上代码:function unique(arr) { let obj = {} return arr.filter((item, index) => { // 防止key重复 let newItem = item + JSON.stringify(item) return obj.hasOwnProperty(newItem) ? ...
2019-09-05 15:26:21
2775
4
原创 复制文字(兼容主流浏览器、ios和安卓)
话不多说,上代码:html:<input id="copyObj" value="哈哈哈" />js:copyTxt(text) { // 数字没有 .length 不能执行selectText 需要转化成字符串 const textString = text.toString(); let input = document.qu...
2019-07-09 18:16:24
411
转载 H5页面在微信里禁止分享
由于某些原因,放在公众号里的H5页面需要做禁止分享,在网上找到了一个好的方法:document.addEventListener('WeixinJSBridgeReady', function onBridgeReady() {// 通过下面这个API隐藏右上角按钮 WeixinJSBridge.call('hideOptionMenu');});...
2019-05-11 12:09:56
5106
2
原创 css图片颜色设置为黑白
工作中由于某些原因,可能需要前端将图片做去色处理,如图: ——> 这里需要用到css的filter属性,具体介绍:https://www.runoob.com/cssref/css3-pr-filter.html。话不多说,上代码:img { -webkit-filter: grayscale(100%); -moz-filter: grayscale...
2019-05-10 14:54:27
2437
原创 fixed失效
1. perspective 在项目中,写css3动画的时候,用到了perspective,由于某种原因,perspective设置到了body上面,然后导致了fixed的元素定位失效变为absolute。一开始还不知道问题所在,后来各种回滚才发现,虽然也不知道是什么原因。解决办法:给需要3D旋转的元素加一个父级元素,然后给父级元素设置perspective属性。2. trans...
2019-05-10 14:46:47
468
转载 新闻上下轮播
项目中用到了新闻上下轮播,在网上找比较好的方法,记录一下。(转载自:https://blog.csdn.net/weixin_39522730/article/details/84931667)<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <t...
2019-05-08 16:45:44
684
原创 ios fixed失效
在ios中,会出现fixed(固定定位)失效的问题,导致点击显示的弹框位置和层级不够等问题,最简单的解决办法就是把需要设置固定定位的元素直接置于body下面,然后设置position:absolute;...
2019-04-29 09:54:29
257
原创 google地图--自定义标记以及点击事件
之前做项目需要使用到地图,由于是做国外网站,所以考虑了几种地图之后,决定用谷歌地图。但是在完成某一需求时,碰到了问题:点击marker标记,弹出设计图上的内容。谷歌地图默认的弹框和设计图不符合,所有我在网上查询和尝试最后终于实现了需求。记录一下:1.谷歌地图的基本使用实现效果代码如下:<!doctype html><html><head...
2019-04-28 16:07:54
2464
原创 微信小程序图片宽度100%,高度自适应
实现图片自适应,按照一般情况只需设置:img { width: 100%; height: auto;}但是微信小程序里是特例,需要image标签上设置属性mode=widthFix,就是height:auto的作用,css同样设置width:100%,如下:image { width: 100%;}<image mode='widt...
2019-04-25 15:50:42
1983
原创 fullpage最后一屏超出部分滚动
在项目中遇到了fullpage超出部分滚动的问题:最后一屏是底部,不足一屏,再往下滚,不再是整屏滚动,需要往上一屏连接。话不多说,看图:要实现这个功能,需要用到$.fn.fullpage.setAutoScrolling(false);这个方法是改变页面的滚动方式--由整屏滚动改为自然滚动。结合fullpage的钩子函数:afterLoad来使用,看代码: $.fn.f...
2019-04-11 18:24:43
2232
原创 小程序开发点击真机调试时报错 error: iconPath=xx, file not found
这个错误很佛性,去把文件夹的名字换一下就好了,要是觉得不规范,换了好了之后,再换回来就行。
2019-03-08 09:42:00
3771
4
原创 fullcalendar左侧时间格式
在用到jquery的fullcalendar插件时,设计页面需要日视图时左侧时间显示格式为24小时制:插件默认显示为12小时制:查了官方文档,对应的配置属性为axisformat:但是设置了之后,没有作用。然后在网上找了很多问答及资料,终于在一个问题的答案中找找到了对应的配置属性:slotLabelFormat。附:fullcalendar中文文档:https:...
2018-11-09 18:10:56
5118
13
原创 vue的mouseover等事件注册失败问题
在vue项目中用到@mouseover事件,结果发现注册失败,网上搜了之后才知道,在vue中,注册@mouseover等鼠标操作(以mouse为前缀)事件,需要加上.native,例:@mouseover.native。...
2018-11-02 19:04:31
2943
转载 rem结合scss解决移动端自适应大小
原因 我们眼中看到的屏幕是由一个一个物理像素组成的,而我们css使用的是逻辑像素,也可以成为虚拟像素。在我们呈现结果的终端,它们的像素比可能都不一样,这时候我们要采用设备的像素比(DPR),它体现了物理像素和逻辑像素之间的关系,计算公式如下所示: DPR = 物理像素/逻辑像素 所以我们可以知道为啥我们设置的都是12px,14px,为啥显示字体大小不一样。 rem介绍 rem 是相对于根部...
2018-08-25 12:42:21
475
转载 css--loading加载动画
<h1> CSS LOADERS</h1><div class="box"> loader-01 <div class="loader-01"> </div></div><div class="box"> loa
2018-08-25 12:38:19
1242
原创 关于地图的一些资源
百度地图:创建百度地图:http://api.map.baidu.com/lbsapi/creatmap/百度地图api:http://lbsyun.baidu.com/cms/jsapi/reference/jsapi_reference.html#a1b3百度地图使用笔记:https://www.imooc.com/article/4125(转)百度地图拾取坐标系统:http:...
2018-08-21 10:31:27
542
1
原创 Jquery排他
以前在工作中碰到排他的情况都是对所有对象执行反操作,然后再对特定的对象进行正操作,如下: $('button').on('click',function(){ $('button').hide(); $(this).show(); })这种操作大多数情况下都能达到目的,但是在特定的情况下就会有问题,比如除了在切换自己本身状态的同时需要操作其他元素的状态,所以这个时候...
2018-07-31 10:46:32
3254
1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人