前端
金色浪花
如果对于明天没有要求,敲敲代码就像旅游。
展开
-
uniapp本地模拟器、手机真机调试报错{“errMsg”:“request:fail abort statusCode:-1”}解决方案
在本地用uniapp开发项目的的时候,h5渲染没有异常,在模拟器,平板、手机真机的时候报错:{“errMsg”:“request:fail abort statusCode:-1”}。原创 2023-02-13 17:16:45 · 5035 阅读 · 1 评论 -
ElementUI的Select组件在IOS唤不起软键盘解决
原因:在ElementUI的select组件中,如果添加了filterable属性的话,那么实际渲染是这样的:也就是说加多了一个readonly属性,在IOS上的input的readonly属性就会导致软键盘无法弹出的情况。解决:只要移除掉组件的readonly属性就可以了,在select组件中加入如下三个属性:代码:ref="select"@hook:mounted="cancalReadOnly"@visible-change="cancalReadOnly"方法如下:原创 2022-06-15 09:28:40 · 2500 阅读 · 3 评论 -
Canvas清除画布clearRect非常容易踩坑的点
对于cxt.clearRect()的基础理解是这样的:可以用来清除画布中的内容,那么只要cxt.clearRect(0,0,画布宽,画布高) 就可以清除整张画布。如果只理解到这里,那么clearRect就很容易踩到一个坑。我们来下例子,我做了一个自由画板,代码如下:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-原创 2022-05-12 12:25:07 · 15058 阅读 · 1 评论 -
vue中.sync修饰符的作用
子组件要修改父组件的数据,经常采用采用自定义事件去修改。即$emit,这样一来,父组件就要写上修改属性的方法。如:原创 2022-05-03 10:59:39 · 1713 阅读 · 0 评论 -
font-weight在移动端不生效问题
font-weight属性可以加粗字体,可取值:数值、bold、bolder、lighter、normal。当font-weight取数值型的情况下,移动端可能显示不了粗体,部分手机渲染不了数值型的font-weight。示图:所以在手机端使用加粗字体的话,还是用回bold等取值,尽量避免数值型...原创 2022-04-30 11:05:35 · 3111 阅读 · 0 评论 -
animation动画结束后css样式怎么保留最后状态
今天被问到个问题,动画结束后css状态会返回到初始状态,希望动画结束后css状态达到最后的模样。为了达到这个效果,只需要在动画的元素上添加css样式:(animation-fill-mode:forwards)。animation-fill-mode语法animation-fill-mode : none | forwards | backwards | both;值 描述 none 不改变默认行为。 forwards 当动画完成后,保持最后一个属性值(在原创 2021-07-27 12:13:55 · 4319 阅读 · 0 评论 -
网页上播放微信录音amr文件方案
在最近的H5项目中,遇到了个棘手的问题。项目中需要使用微信录音的JSSDK接口,录完音后上传到自己的服务器上。流程如图:整个流程非常清晰,也十分顺利。但下载到网站服务器上的文件时amr格式的音频文件。这种文件前端页面无法直接播放,无论时audio标签,还是各类JS播放音频文件的库都不支持直接播放amr文件。查了很多资料,总共有以下三种解决方案:1、上传时通过阿里云OOS、七牛云等云存储系统的API接口直接转码保存这里以阿里云OOS为例,文档地址:传送门但是!!!!!...原创 2021-07-22 14:46:13 · 1557 阅读 · 0 评论 -
多个tramform元素层叠问题解决
在同一父级下的多个transform元素,后声明的元素的层级要在先声明的元素之上。这就会导致后者会覆盖前者。如果我们要做一个音乐播放动画,那么就会出现这种情况:HTML代码:在transform中,z-index是失效的,因此不能通过设置z-index来解决问题。解决方案:在transform中要通过设置两者 Z 轴的方向,首先要在父级元素上声明变换类型(transform-style)为3D变换,然后设置子元素的 translateZ 属性,即可。Transform-style:原创 2021-07-22 11:29:16 · 989 阅读 · 0 评论 -
Element组件踩坑记录
1、Dialog内放置表单,在初始化、resetField操作中出现异常。原因:Dialog为中的body内容为动态渲染。即第一次页面加载的时候,并不会渲染放置其中的表单因此要将更改表单值的操作放置在 $nextTicket 操作当中。然后判断 this.$refs['dialogForm'] 的值是否为 undifiened 进行下一步操作。openDialog(type,data) { this.dialogFormVisible = true; this原创 2021-07-08 09:18:47 · 261 阅读 · 0 评论 -
企业微信JSSDK接口页面加载完无法立即执行的问题
有一个需求,是希望用户一进来就自动获取其地理位置。因此,我在代码中是这样写的我希望在页面挂载前就获取数据。然而却无法成功:问题分析:1、JSSDK能获取权限。证明不是签名认证的问题2、能打印出 w_l 字符,证明函数确实有被执行3、没有报任何异常,接口也没有输出,那很可能是执行了函数但是没有执行接口。于是乎猜测可能JSSDK也是异步操作,类似与jquery的 ready 一样,于是乎翻阅了一下文档,发现其中有这么一段话:那么答案很明显,跟我猜测的一致,于是乎改写如下.原创 2021-06-24 13:57:01 · 801 阅读 · 0 评论 -
JS使用策略模式改写表单验证
现在我们有一个表单JS写表单验证,常见的写<form action="/" id="myForm" method="POST"> 用户名:<input name='user' type="text"> 密 码 :<input name='pwd' type="text"> <!-- 手机号:<input name='phone' type="text"> --> <button ty原创 2021-06-16 13:32:12 · 287 阅读 · 0 评论 -
JS数组常用操作【判断类型、最大值、最小值、去重、扁平化等等】
一、isArraylet a = [1,2,3,4]Array.isArray(a) // true原创 2021-06-04 15:37:22 · 328 阅读 · 0 评论 -
JS内存泄漏的几种情况
一、闭包这是我们故意泄露出来以达到我们目的的一种方式。二、意外的全局变量例如:原创 2021-06-04 15:16:49 · 420 阅读 · 0 评论 -
JS函数预编译过程
众所周知,函数有自己的作用域,并且JS存在函数预编译。那么今天来简单谈一谈,函数预编译的过程。函数预编译主要分为四步:1、创建执行上下文对象AO ,ji'shi原创 2021-06-04 11:30:12 · 447 阅读 · 1 评论 -
JS节流函数应用及实现
一、节流概念节流函数指的是在频繁触发的事件中,在一定时间内只执行一次。举个栗子,你是个蛋糕狂爱好者,你每天都要路过蛋糕店,并且每次都要进去买蛋糕吃。但是现在你决定要jian'f原创 2021-06-04 10:37:54 · 804 阅读 · 0 评论 -
JS防抖函数实现及应用
一、什么是防抖函数:防抖函数是指事件多次不间断触发,在一定时间内没有再触发时,执行最后一次触发的事件函数。 举个例子,你每天给你女神送牛奶,原创 2021-06-04 09:42:13 · 3511 阅读 · 0 评论 -
解决bootstrap中table栏宽度限制问题
在bootstrap中table默认是当前容器宽度的100%的,不会出现水平滚动条。像这样子:这时候无论如何设置宽度的值,这个显示效果都不会变。要解决这个现象,并且出现水平滚动条,我们可以这样做。为table添加一个text-nowrap的类,然后为设置table的样式table-layout:fixed;如图:这下width就起作用了。...原创 2020-08-08 17:46:03 · 4553 阅读 · 0 评论