- 博客(228)
- 收藏
- 关注
RSS订阅
原创 微信小程序订阅消息及遇到的种种坑解决方法（全）
前言微信小程序「订阅消息」能力，来了！搜集分享使用订阅消息的流程方法以及各种奇葩问题统一整理，欢迎讨论~与「模板消息」不同的是，其是在用户点击触发或者支付成功之后，开发者可在 7天内推送1-3条服务通知。而「订阅消息」则需要用户主动订阅消息通知，开发者才可向用户推送，但不受时间限制，具体发送信息条数根据该能力的不同类型有不同标准。此外，值得注意的是，使用「订阅消息」后，原小程序模板消息接口将于2020年1月10日下线，也就无法再使用原接口推送模板消息，开发者们需要注意及时调整接口。但是，微
2021-01-16 16:47:44
32551
62
原创 【javaScript】Javascript中的 位运算符 + 使用场景 + 性能对比 + 封装
文章目录一、位运算符二、区别（题外话）2.1 与运算分为普通与（&）和短路与（&&）两种2.2 或运算分为普通或（|）和短路（||）或两种三、AND运算符'&' -- 按位与3.1 '&' 计算原理过程3.2 '&' 应用场景四、OR运算符'|' -- 按位或4.1 '|' 计算原理过程4.2 '|' 应用场景4.3 位运算符 '|' 、'~~' 与...
2019-11-04 00:34:46
1482
1
原创 【性能优化】前端性能优化方案都帮你整理好了（全面系统）！
前言前端是庞大的，包括 HTML、 CSS、 Javascript、Image 、Flash等等各种各样的资源。前端优化是复杂的，针对方方面面的资源都有不同的方式。那么，前端优化的目的是什么 ?1. 从客户端角度而言，优化能够让页面加载得更快、对用户的操作响应得更及时，能够给用户提供更为友好的体验。2. 从服务器端角度而言，优化能够减少页面请求数、或者减小请求所占带宽，能够节省可观的资源...
2019-10-15 02:22:59
749
原创 【性能优化】介绍下重绘和回流（Repaint & Reflow），以及如何进行优化
前言回流（Reflow） 和 重绘（Repaint） 可以说是每一个web开发者都经常听到的两个词语，我也不例外，可是我之前一直不是很清楚这两步具体做了什么事情。而且很尴尬的是每每提到性能优化的时候，我们可以说出 减少回流及其重绘 可以提高页面性能，当然但是一深入问到有什么方式呢？可能就说不出具体体现了，所以整理一下有关这方面的知识 ↓从浏览器的渲染的过程出发从上面这个图上，我们可以看到，...
2019-09-11 23:14:54
1465
原创 audio / video 媒体标签在IOS端触发不了的两种解决方法，亲测有效~
什么？？音视频标签在IOS手机上播放不了，你一定踩了这个坑，来看看怎么解决吧~
2022-04-02 10:03:48
4954
原创 惊~只需要这样配置就可以让小程序使用Prettier格式化，还支持wxml等文件
小伙子做梦都没想到，原来这样配置就可以让小程序使用Prettier格式化
2022-03-21 15:25:57
8731
7
原创 js判断字符串是否为JSON格式【最简单的方法】
js判断字符串是否为JSON格式function isJSON(str) { if (typeof str == 'string') { try { var obj=JSON.parse(str); if(typeof obj == 'object' && obj ){ return true; }else{ return fals
2021-04-29 19:41:38
6587
转载 vue项目如何刷新当前页面
1.场景在处理列表时，常常有删除一条数据或者新增数据之后需要重新刷新当前页面的需求。2.遇到的问题用 vue-router 重新路由到当前页面，页面是不进行刷新的采用 window.location.reload() ，或者 router.go(0) 刷新时，整个浏览器进行了重新加载，闪烁，体验不好3.解决方法provide / inject 组合作用：允许一个祖先组件向其所有子孙后代注入一个依赖，不论组件层次有多深，并在起上下游关系成立的时间里始终生效。App.vue:声明
2021-04-29 19:34:57
301
原创 微信小程序实现点击订阅消息在特定的时间点发送
前言首先这个下发订阅消息，是可以后端处理的；因此关于后端的操作，我就不讲了，后端定时触发这个下发操作可以通过定时器执行（后端处理相对简单灵活）。但这里我们主要说云函数如何实现这个定操实现「小程序·云开发」不仅支持通过云调用免 access_token 发送订阅消息，而且支持在 定时触发器 中实现云调用，因此我们可以使用这个切入口来实现我们得定时触发需求~前置工作先写好授权订阅操作相关代码（有关授权操作细节可以看 微信小程序订阅消息及遇到的种种坑解决方法（全））myCourse.wxml在
2021-04-13 15:19:47
3318
5
转载 vue解决element-ui popover点击取消时 popover的显示与隐藏问题
最近在项目中使用 elementui 中的table组件popover进行开发，官网的案例如果使用数据遍历，操作列使用 <template></template> 做 插槽的话就不行了。记录下解决办法：1. popover演示效果2. 解决办法如下在 el-popover 中加属性 :ref="popover-${scope.$index}"取消 el-button 按钮加 @click="scope._self.$refs[popover-${scope.$index.
2021-03-31 10:50:25
1593
3
原创 vue组件样式穿透 /deep/ 、 ＞＞＞ 和 ::v-deep
在 style 经常用 scoped 属性实现组件的私有化时，要改变 element-ui 某个深层元素（eg:.el-input__inner）或其他深层样式时，需要使用 /deep/，如：.conBox /deep/ .el-input__inner{ padding:0 10px;}注意，/deep/ 在 vue 3.0或者新版scss-loader不支持 会报错如果 /deep/ 报错，可采用 ::v-deep ，效果基本一样，有人说 ::v-deep 能加快编译速度，但是我在网上
2021-03-31 09:48:19
1426
原创 使用CSS隐藏元素滚动条【兼容主流浏览器】
如何隐藏滚动条，同时仍然可以在任何元素上滚动？首先，如果需要隐藏滚动条并在内容溢出时显示滚动条，只需要设置 overflow：auto 样式即可。想要完全隐藏滚动条只需设置 overflow：hidden 即可，但是这样一来将导致元素内容不可滚动。时至今日，还没有任何一条CSS规则可以使元素可以隐藏滚动条的同时依然可以滚动内容，只能通过针对特定浏览器设置滚动条样式来实现。Firefox浏览器对于 Firefox ，我们可以将滚动条宽度设置为none：scrollbar-width: none; /*
2021-02-26 18:05:53
19199
原创 element-ui cascader级联选择器，使用getCheckedNodes()获取选择对象参数信息，及如何使用props自定义设置value、label、children的键名
需求一：我需要在cascader级联选择后，拿到当前选择对象的其他参数信息，而不单单只获取到选择的value值如上图，ElementUI 提供了这个获取所选节点的信息函数 getCheckedNodes，正好解决了我需要当前节点的其他信息，不单单只是选择时返回的 value 值需求二：后端返回的数组，并不是cascader级联选择器默认的value，label，children怎么修改成当前的键值来循环呢？但至于怎么用，文档都没有给出例子，所以这里补充一下用法，直接上代码：<t
2021-02-01 18:35:14
26186
7
原创 H5键盘收起弹出js判断方法【Android与IOS不同监听方法】
var ua = navigator.userAgent.toLowerCase()var isIOS = /iphone|ipad|ipod/.test(ua);var isAndroid = /android/.test(ua); // 监听输入框的软键盘弹起和收起事件function listenKeybord($input) { if (isIOS) { // IOS 键盘弹起：IOS 和 Android 输入框获取焦点键盘弹起 $input.addEven
2021-01-25 10:45:39
1413
原创 windows上手动安装node-sass【解决npm install失败问题】
关于安装配置 node.js 的我这里就不细讲了，在8以上的的版本会携带有npm包，所以安装了 node.js 后 就附带有 npm这里直接将一下，全局安装 node-sass 出现的问题当我执行npm install -g node-sass出现了一下警告：npm WARN deprecated [email protected]: request has been deprecated, see request/request#3142[…] | fetchMetadata: WARN dep
2021-01-18 18:25:28
2403
转载 安卓微信二次分享不显示描述和图片
问题描述在做微信分享的时候有遇到过这样的问题，，第一次分享到微信，描述和图片都能正常显示，但是打开连接用微信自带的分享功能进行分享时，就会出现以下情况：描述变链接、图片不显示、标题变更。导致的原因实现微信分享需要调用JSSDK的两个分享接口，按照微信JSSDK最新JS 1.4.0文档上说： “原有的 wx.onMenuShareTimeline、wx.onMenuShareAppMessage 接口，即将废弃”。所以我们使用了最新的 wx.updateAppMessageShareData 、upd
2021-01-16 17:42:56
2042
原创 在 Vuejs 项目中如何定义全局变量 全局函数让组件共享数据 → 替代vuex的数据共享
https://www.cnblogs.com/liuyishi/p/9459289.htmlhttps://blog.csdn.net/xianchanghuang/article/details/104363955
2020-12-30 09:18:39
1411
原创 解决：vue cli3:Invalid Host/Origin header error @client
vue cli 3:Invalid Host/Origin header error @client 解决办法：项目根目录下创建 vue.config.js , 添加配置如下：// vue.config.jsmodule.exports = { .... devServer:{ disableHostCheck:true }}
2020-12-21 14:09:59
861
原创 IOS微信浏览器返回事件popstate监听 会立即执行一次【解决方案】
页面跳转从a->b->b1->c，然后从c返回到b再到a。（监听popstate）IOS版的微信，是会立即触法popstate事件，导致直接从C页面跳转到A页面解决办法：var bool = false;window.addEventListener('pageshow',function(){ bool = false; setTimeout(function(){ bool = true; },1000)//延迟1秒 防止ios微信返.
2020-12-16 20:15:35
1013
原创 firefox火狐浏览器outline:none去除虚框失效的坑【兼容坑】
问题描述：H5界面在点击按钮时，因为登录按钮获得焦点，按钮上出现了难看的虚框，强迫症患者表示谁也忍受不了…… 解决方案找了很多方法，比如直接在css样式中加这行代码button:focus,button:actived{outline:none;}又比如在js代码中解决$("a,input,button").focus(function(){this.blur()});然而，尝试了无数次，都失败了，为什么呢？因为笔者用的是火狐浏览器……需要用一条火狐浏览器私有的命令，这样b.
2020-12-15 09:48:01
428
转载 使用http访问页面时，将其跳转成https
由于项目业务升级，网站升级 https 协议。在 HTTPS 承载的页面上不允许出现 http 请求，一旦出现就是提示或报错：Mixed Content: The page at 'https://www.example.com' was loaded over HTTPS, but requested an insecure image ‘http://static.example.com/test.jpg’. This content should also be served over H.
2020-12-15 09:47:15
2539
转载 vue中eventbus被多次触发（vue中使用eventbus踩过的坑）
一开始的需求是这样子的，我为了实现两个页面组件之间的数据传递，假设我有页面A，点击页面A上的某一个按钮之后，页面会自动跳转到页面B，同时我希望将页面A上的某一些参数携带过去给页面B。（我知道，小参数的时候可以通过路由的params或者query去传参数，或者大型数据可以用vuex来处理，很遗憾我到现在还没有做很大型的项目，所以还没有用过vuex，接下来会学习一下。）然后我就想，这不就是不同组件之间的数据传递问题而已吗？直接用bus 巴士事件来传递数据不就行了吗。于是，我就很愉快地进行了。关于vue中的.
2020-12-14 17:11:14
792
14
原创 浏览器原生剪贴板 navigator.clipboard与document.execCommand 及 vue-clipboards使用
前言前端有时会有这样的需求：点击复制就可以复制对应的文案，这也是方便用户操作实现复制的目的，这里就整理一下实现该功能的使用方法及注意事项~~~document.execCommand相比用过这个 API 的多半是写原生 Aditor 编辑器的吧，他算是最早提供该支持的API了，API 里面有很多方法，如很常见的 加粗/斜体/字号/字体颜色/插入图片/插入链接/复制、剪切、撤销等等… 具体可以看 MDN而我们这里就来用用这个「复制」功能，废话不多说先上代码：function copy(text
2020-12-14 11:53:23
9348
3
原创 css transform导致字体像素模糊的问题解决办法（多种方法，亲测有效）
https://blog.csdn.net/weixin_38414352/article/details/77100377?utm_medium=distribute.pc_relevant.none-task-blog-BlogCommendFromMachineLearnPai2-10.control&depth_1-utm_source=distribute.pc_relevant.none-task-blog-BlogCommendFromMachineLearnPai2-10.contr
2020-11-26 18:29:01
8349
1
原创 去除input[type=number]的默认样式且解决一下maxlength失效问题
去除input[type=number]的默认样式input[type=number] { -moz-appearance:textfield;}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0;}解决maxlength失效maxlength 是对于 type=
2020-11-24 20:27:19
430
原创 git报错：error: failed to push some refs to ... 的解决办法及如何让线上覆盖本地方法【Git/SVN】
报错代码在 push 的时候，出现如下错误：error: failed to push some refs to ‘ssh://[email protected]:1024/test-power.git’hint: Updates were rejected because the tip of your current branch is behindhint: its remote counterpart. Integrate the remote changes (e.g.hint:
2020-11-20 18:24:16
40164
1
转载 vue中Cannot read property ‘_wrapper‘ of undefined 报错
出现这个报错，是你 @click 的方法没有在 methods 中定义，很奇葩的报错，竟然不会定向到具体哪行。
2020-11-16 11:46:41
1547
1
原创 移动端rem，机型适配布局界面配置，摆脱花里胡哨样式出现（一套操作适配所有机型）
移动端rem，机型适配（再配合lass，sass，按照设计图来设置比例，本文使用的是640；还有750的）(function () { document.addEventListener('DOMContentLoaded', function () { var deviceWidth = document.documentElement.clientWidth; if(deviceWidth > 640) deviceWidth = 640; document.document
2020-11-05 18:00:49
987
原创 js模仿jquery里的几个方法siblings，next， pre，nextAll，preAll
siblings函数/*siblings函数, 选取node的所有兄弟节点*/function siblings(node){ if(node.nodeType === 1){ node.flag = true; //给当前节点打上一个标志 var children = node.parentNode.childNodes, length = children.length, tempArray = [],
2020-11-05 11:12:21
742
原创 文件音频上传--实现带有进度提示的上传
前言Html5 终于解决了上传文件的同时显示文件上传进度的老问题。现在大部分的网站用 Flash 去实现这一功能，还有一些网站继续采用Html <form>with enctype=multipart/form-data，但是需要修改服务器端可用才能显示给用户文件上传的进度。本质上你需要做的工作是在服务器端接收一个文件时，你发送给它一个字节流，所以你需要知道你已经接收到多少字节并以某种方式传达这些信息给客户端浏览器，在这个过程一直在不断的进行文件的上传。这种方式运行的非常好，不像 Flash
2020-11-04 15:31:14
416
原创 微信小程序 -- 退出小程序骚操作【微信小程序/公众号】
微信小程序官方并没有提供退出的api。但是提供了 navigator 这个组件使用方法：<navigator open-type="exit" target="miniProgram">关闭按钮</navigator>官网组件直通车：https://developers.weixin.qq.com/miniprogram/dev/component/navigator.html可以看到最后一个值。当设置 open-type 设置为 exit 时，必须要设置为tar
2020-10-22 13:46:24
1058
原创 编写高质量可维护的代码之优化逻辑判断【代码优化】
文章目录1.编写高质量可维护的代码之优化逻辑判断1.1JavaScript 语法篇1.1.1嵌套层级优化1.1.2多条件分支的优化处理1.1.3使用数组新特性简化逻辑判断多条件判断判断数组中是否所有项都满足某条件判断数组中是否有某一项满足条件1.2.1函数默认值使用默认参数使用解构与默认参数复杂数据解构1.3.1策略模式优化分支逻辑处理2.框架篇之 React JSX 逻辑判断优化2.1JSX-Control-StatementsIf 标签Choose 标签For 标签With 标签3.总结4.参考文献1
2020-10-10 17:18:33
963
3
转载 vue移动端下拉刷新、上拉加载
前言由于自身的项目比较简单，只有几个H5页面，用来嵌入app中，所有没有引入移动端的UI框架，但是介于能让用户在浏览H5页面时有下拉刷新和上拉加载，有更好的用户体验，自己写组件实现。1、下拉刷新 DropDownRefresh.vue<template lang="html"> <div class="refresh-moudle" @touchstart="touchStart($event)" @touchmove="touchMove($event)" @touch
2020-10-10 16:40:25
3158
2
转载 JS转换HTML转义符
1.去掉html标签function removeHtmlTab(tab) { return tab.replace(/<[^<>]+?>/g,'');//删除所有HTML标签}2.普通字符转换成转意符function html2Escape(sHtml) { return sHtml.replace(/[<>&"]/g,function(c){return {'<':'<','>':'>','&':'
2020-09-10 11:47:21
661
转载 mint-ui的日期选择框DatetimePicker，android手机显示空白问题
有华为或小米手机出现日期选择框，日期显示空白，确定和取消还在的问题，这些个兼容问题真的是很难查，但是好在网友给力，搜到了解决办法，分享给大家~~其实很简单，修改一个属性就行.picker-items{ width:100% }原文地址：https://blog.csdn.net/qq_34664239/article/details/93870689...
2020-09-09 16:34:38
880
原创 微信公众号监听返回按钮关闭当前界面，部分安卓机监听popstate失败【小程序与公众号】
需求：微信公众号开发的时候，可能会出现这种需求：微信公众号内指定某个网页在点击返回键时不回退到上一级，而是直接关闭微信浏览器窗口，用户点击返回按钮本身就是一个返回事件。解决方案： 利用监听返回事件 window.addEventListener("popstate", function(e) {//你的逻辑}, false)两种监听返回关闭方法：（1）需要微信授权//当点击返回键时，不返回到上一页，而是直接关闭微信浏览器function onBackCloseWindow() { pushH
2020-08-24 20:18:04
3949
6
转载 使用AJAX实现文件上传时illegal invocation错误的原因及解决方案
原文链接：https://blog.csdn.net/qq_42181069/article/details/803337791、报错截图：2、代码部分：<script>$(function(){ $('input').change(function(){ //使用JQ的ajax //结合formData实现图片预览 var sendData=new FormData(); sendData.append('i.
2020-08-24 14:14:29
588
转载 git切换到别的分支,要暂时保存当前分支的修改【Git】
git切换分支保存修改的代码的方法最近在一个原有的项目上做一次非常大的改版，底层的数据库做了很大的变化，跟现在的版本无法兼容。现在的工作除了开发最新的版本之外还要对原来的版本做例行的维护，修修补补。于是有了在两个分支之间游走切换的问题，最新改版的代码在分支new上，旧版本的代码在分支old上，我在new上开发了一半，忽然有人给了我一个改进的需求，于是我要切换回old去修改代码。在这个场景下，我摸索了三种方法：及时commit代码在new分支上把已经开发完成的部分代码commit掉，不push，然后切换
2020-08-17 14:50:31
3432
原创 Vue中的keep-alive 组件级缓存【Vue】
一、需求分析在Vue构建的单页面应用（SPA）中，路由模块一般使用 vue-router 。vue-router 不保存被切换组件的状态，它进行 push 或者 replace 时，旧组件会被销毁，而新组件会被新建，走一遍完整的生命周期但有时候，我们有一些需求，比如跳转到详情页面时，需要保持列表页的滚动条的深度，等返回的时候依然在这个位置，这样可以提高用户体验。在Vue中，对于这种“页面缓存”的需求，我们可以使用 keep-alive 组件来解决这个需求。二、keep-alive定义keep-a
2020-08-07 14:19:42
910
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人