- 博客(29)
- 资源 (2)
- 问答 (1)
- 收藏
- 关注
原创 移动端Swiper的一些尝试(中间完整,两边有内容,循环展示)
移动端Swiper,实现两边部分内容,中间完整内容,循环swiper不更新不循环修正
2022-12-23 19:44:23
1562
原创 学习总结——bug解决ios 12 中个别文案不展示
【排查过程】其他机型正常,然后此处内容展示使用了vue中的v-html承载富文本内容,查看标签发现,不展示的项目中都是在富文本中使用span标签包裹的文字内容。所以怀疑是span标签在ios 12中存在某种兼容性问题吧,众所周知,span标签是行内元素,考虑调整样式满足兼容。【解决办法】给承载富文本标签的容器添加class类名,然后对类名下的span标签单独设置样式,具体样式代码如下,再次测试,问题解决,特此记录。
2022-10-19 10:13:10
782
原创 学习总结——h5搜索框input回车自动搜索,及IOS X及以上h5 input页面切换后显示内容丢失fix
搜索input实现,搜索框ios xr下页面跳转后query丢失解决
2022-07-07 10:42:22
3802
原创 学习总结——通过css设置上下滑出,左右滑出动画效果
【背景】小程序需求中涉及了一个actionsheet半屏菜单,和一个滚动时候需要隐藏一半的icon,所以要求添加从底部滑出,从右侧滑出的动画效果。需要从底部滑出的半屏菜单是带黑色遮罩的模态弹窗页面,需要从右侧滑出的是悬浮的icon,我们使用了uniapp的框架,所以模板部分写法和vue类似【关键字】css的animation,我是文档的搬运工CSS animation 属性【底部滑出】模板部分——一般的模态窗会直接设置显示隐藏,但是需要底部滑出的动画效果,内容区域不能直接通过控制dom显示隐藏来
2022-04-07 11:18:22
13971
3
原创 学习总结——小程序中输入框和键盘的那些事
【背景】最近做了几个需求,涉及在小程序中蒙层或者其他固定布局中使用输入框(input),然后光标放置的时候移动端键盘弹起,会影响页面本来的布局设置,dom整体会被键盘整体顶起来【问题解决】调研了一下,这种情况有两种解决方式1、设置input属性,让键盘顶起不影响页面【步骤】搜索小程序的文档,input的属性(文档搬运工,微信小程序input | 微信开放文档,百度小程序百度智能小程序文档)设置adjust-position为false,键盘弹起不会上推页面【优点】解决了dom上移
2022-04-06 20:56:37
3426
1
原创 学习总结-低版本浏览器(移动端ios9以下或者pc低版本IE)不兼容promise finally的写法全局处理
【背景】测试反馈问题,某h5列表页IOS9中列表不显示,其他机型和环境正常【问题排查】抓包发现请求没有发出,检查代码发现请求列表之前调用了某个接口使用了promise的finally的语法,处理了请求后统一操作,怀疑是低版本浏览器不兼容此语法,去掉finally之后列表请求可以发出【问题解决】考虑系统中很多页面都使用了finally的语法处理,选择全局进行兼容,参考文章浏览器不支持promise的finally - 迷离不迷离 - 博客园引入promise.prototype.finally,
2022-04-02 14:35:15
1251
原创 记录一次ios下fixed区域中滚动内容滑动到底部/顶部后不可滑动的问题修复
如题,ios多机型,h5的页面制作的一个展示列表,外部采用fixed布局固定显示了表头筛选项的一些东西,然后中间是内容可滚动区,如下图,然后ios的机型会出现的问题就是,滚动到顶部或者底部再用力划一下的话(等到内部滚动区域滚动条消失),滚动就会被卡住,滚不动了...
2021-12-31 15:34:37
3085
原创 记一次Iphone11,在IOS13系统版本下自定义ActionSheet多次打开关闭后右侧和下方出现白色遮罩影响本来样式的问题
如题,记录一次问题解决,困扰我两天之久,最后终于解决背景:一个加载信息的长列表,就普通长列表,没有用fixed,absolute之类的布局,筛选自定义了ActionSheet半屏菜单,半屏菜单fixed设置了遮罩,然后内容部分高一层级的内容fixed底部,设置了定高,有title区和底部确认btn区,中间内容滚动可见,提测后,iphone11机型ios13版本下,底层列表数据很少时(这个是后来试了很多次必现的条件才发现的)半屏菜单右侧出现白色竖条,底部也有白色遮挡,如下图,正常的应该半屏菜单显示筛选项内
2021-08-02 14:55:15
308
原创 小程序开发常见问题
Q: new Date(”2020-09-10 12:34:56“).getTime() 获取的时间戳在ios下不正确A:时间格式为:2017-12-12 12:00:00在苹果上获取时间戳有兼容性问题 需要转换成2017/12/12 12:00:00 才可以正确获取到时间戳newDate(”2020-09-10 12:34:56“.replace(/-/g,'/')).getTime()才可以Q:在IOS下可滚动的列表页滚动不生效A:(1) 排查页面配置是否配置了disa...
2021-06-07 13:45:09
986
原创 记录一次nuxt项目的创建
一、创建项目我是官方文档的搬运工https://zh.nuxtjs.org/docs/2.x/get-started/installation,一点要好好读,或者多去github里面的issue里面去查一查~npm init nuxt-app <你的项目名称>已经创建好的项目长这样,在各个文件夹中都有对当前部分的注释,很好理解,这里我不做赘述,直接npm run dev ,就可以起跑起来了,现在你已经拥有一个初步的nuxt项目了二、原有内容迁移因为我是修改旧项目的架构.
2021-01-12 19:41:35
311
2
原创 记录html2canvas前端海报绘制,图片跨域导致绘制失败,下载的海报没有网络图片问题纯前端解决
背景之前的一个需求,web端,业务中的某个内容以海报的形式在页面上呈现,然后点击下载按钮,将海报保存为图片存储在本地,最近产品反馈了一个问题,海报下载时,顶部的banner图片在浏览器中能正常呈现,下载后的图片顶部banner不能够正常显示,这块的下载的时候的海报绘制,是通过html2canvas来实现的。问题排查开发者工具打开时,海报正常绘制,关闭开发者工具,下载海报,顶部banner不显示,打开控制台,提示AccesstoImageat'xxxx(我的图片)'fromorigin...
2020-10-15 16:47:40
1284
原创 微信小程序在IOS下的一些兼容问题记录
1、使用js的new Date(”2020-09-10 12:34:56“).getTime() 获取的时间戳在ios下不正确【解决】时间格式为:2020-09-1212:00:00在苹果上获取时间戳得到的结果为NaN,解析不正确,需要转换成2020/09/12 12:00:00 才可以正确获取到时间戳newDate(”2020-09-10 12:34:56“.replace(/-/g,'/')).getTime()才可以2、在IOS下可滚动的列表页滚动不生效(在开发者工具和安卓手机下均正...
2020-08-26 19:38:05
1123
原创 记录一次VUE移动端H5的文件预览
s最近接到了来自产品的一个需求,将我们的erp的移动端中的审批部分的上传附件进行优化,可以在移动端直接预览上传的文件(一般为发票和凭据图片文档等),所以需要由前端直接对文件进行预览(之前的方式是后端返回网络链接,下载下来之后在本地自行进行文件预览)最后商榷的是最大类型的预览文件(支持pdf,各类图片,word和excel文件)一开始考虑成型的线上文件预览服务如xdoc,但是考虑到纯线上服务我们设计报销审批的敏感文件信息,自己部署服务需要付费啊哈哈(你们懂得),所以另辟蹊径,单独对各个文件类型...
2020-06-05 15:26:42
9594
16
原创 小程序绘制海报的那些问题——记录一次uniapp小程序生成分享海报的问题及解决
最近做了一个需求,一个推广活动,在小程序中生成推广海报并且支持保存在手机相册,UI稿中呈现的是一个非全屏的固定宽高的海报图片,在保存的时候遇到了如下问题并一一解决【问题1】开发者工具中可以正常绘制海报,真机上却不行【解决】因为绘制的海报中包含banner和太阳码图片,需要使用内置方法.getImageInfo()获取解析一下图片信息,才能绘制在画布当中【问题2】真机中偶现canvas画布中文字绘制不全【解决】context.draw()这个行为是异步的,我们使用uni.canvasToTem
2020-05-28 19:59:29
1928
原创 vue-cli-service根据不同环境打包
我在使用vue-cli3创建项目后,在package.json中会自动生成npm run 会执行的脚本,今天在配置开发、测试和线上环境的时候,我突然发现,日常开发使用的serve脚本:后面写的是vue-cli-serviceserve,然后打包构建是,使用的vue-cli-servicebuild,那么这二者有什么区别呢?首先最直观的npm run serve时会把process.en...
2020-03-17 14:56:38
1126
原创 win7系统,不联网情况使用adb.exe devices 检测不到移动设备问题解决——usb驱动离线安装
1、在设备管理器中找到移动设备(一般会带有黄色感叹号),此时识别为其他设备2、右键单击移动设备打开以下页面3、进入下一步选择从计算机的设备驱动程序列表中选择4、进入设备列表后默认选择全部设备,第一个,点击下一步5、选择从磁盘安装6、点击浏览进入驱动程序目录,找到android_winusb.inf文件,如果没有可以在sdk目录中找到或自行下载,我在自己的sd...
2019-11-15 15:22:10
1085
原创 移动端H5页面中加载的图片,在chrome和安卓手机中显示正常,在iphone和safari浏览器中个别图片显示问号的问题处理
最近开发了一个类似文章列表的页面,左边是图,右边是文字,配置在公众号中进行使用,测试通过以后线上运行发现个别项的图片在chrome和安卓手机下可以正常显示,在ios系统的sarafi下显示一个白方块中间一个蓝色的问号,如下图排查的过程当然是先各种搜搜搜了,然后网上反馈的信息多种多样1、查log,console下有如下信息,但是10张图10个提示都有,只有一张没显示,这不科学,我这只是w...
2019-11-15 14:00:06
5760
原创 vux组件在php的laravel框架中调用Calendar等组件报错的解决办法
在php的laravel框架中引入了vux移动端框架,首先进行的基本的loader配置,可以参考这篇文章https://learnku.com/articles/3922/use-vux-2-in-the-correct-position-in-laravel-mix,引用一些常规组件并没有出现问题,但是在引入Calender组件时出现了报错,报错没有留截图,大致是【...props未识...
2019-05-09 15:24:29
235
原创 使用VUX中的Popup-picker组件中遇到的问题记录
新换了业务线,有移动端和web端的开发内容,移动端使用的是vux移动端组件,在使用Popup-picker时遇到了一些问题,特此记录1、设置联级选择官网demo链接https://doc.vux.li/zh-CN/components/popup-picker.html官网的联级选择是地区,完整的都有三级数据,我的数据比较特殊,第一级都有,第二级只有一个选项有,第三级也只有一个选项有...
2019-04-16 15:04:29
9399
2
原创 微信中使用scroll-view实现滚动页面,上拉加载更多频繁回到顶部(避坑scroll-y滚动页面中,在顶部设置了fixed的搜索框中文字在iphone设备中掉出页面外的问题)
问题出现于一个滚动列表页,在顶部设置了fixed样式的搜索框,结果测试过程中,搜索框中的文字在视图滚动时会掉到页面外面来,为了解决这个问题,采用了以下的方式(1)调整样式,之前的fixed搜索框和滚动列表区域均使用absolute在页面进行定位并设置不同的top值分隔开来,列表区域不再设置scroll-y样式,改用小程序原生的scroll-view滚动视图实现滚动列表(2)这样的解决办法需...
2019-04-09 11:18:42
975
原创 微信小程序iphone7设备下跳转h5页面失败,h5页面显示白屏,加载报错,其他页面正常显示
如题,遇到了上面这个问题,在小程序的webview中加载了一个h5页面,满足某种条件的时候跳转到到这个h5页面,这个页面处理了一些逻辑,处理完成后会跳转回来这个页面,所以在往这个h5页面跳转的时候也携带了一些参数,在众多设备都正常,然后遇到了iphone7!(7plus,6等也不行),页面跳过去是一个白屏!(真心无力吐槽ios里面小程序的各种兼容问题)排查过程1、在小程序页面中打开了调试查...
2019-04-08 19:01:02
4562
3
原创 微信小程序指定场景调试(模拟公众号跳转、模拟小程序跳转)
最近开发中常常遇到需要模拟公众号跳转到某个小程序或者小程序跳转小程序的情况,开发阶段一般我们都使用微信开发者工具进行开发,存在跳转的情况应该如何模拟呢,尤其是遇到bug的时候,总是在真机上面看真是太吃力了。。。网上搜了很多资料,总结了几种方法,自己总结的同时也希望可以帮助到其他人哈1、小程序跳转小程序模拟(1)在来源小程序中设置小程序跳转的有关信息如下图代码 wx....
2019-04-08 18:45:22
8828
4
原创 小程序跳转问题踩坑(小程序跳转H5,H5跳回小程序,小程序跳转小程序)
最近遇到了一系列的小程序的跳转问题,甚是头大,好不容易最后都解决了,总结记录一下1、小程序中加载H5页面,H5页面是一个表单,提交后执行跳转到小程序的其他页面(1)小程序中加载H5页面在小程序中加载H5页面需要通过小程序提供的<web-view>(官方文档看这里https://developers.weixin.qq.com/miniprogram/dev/compo...
2019-01-19 10:42:23
6389
2
WIN7下adb检测不到移动设备的解决办法
2017-09-01
Microsoft.ACE.OLEDB.12.0 在应用时,编译.net应用程序的问题
2016-07-13
TA创建的收藏夹 TA关注的收藏夹
TA关注的人