随笔分类 - 移动端开发
移动端Web的一些知识
摘要:###直播协议HLS和RTMP 直播技术一般有两种协议方式,分别是HLS和RTMP,两种协议分别的解释: HLS ,是苹果公司实现的基于 HTTP 的流媒体传输协议,全称 HTTP Live Streaming,可支持流媒体的直播和点播,主要应用在 iOS 系统,为 iOS 设备(如 iPhone、
阅读全文
摘要:####如何实现横向滚动(兼容safari,微信,浏览器) ``` 实现横向滚动需要以下几点: 1、父级盒子要overflow-y:hidden;overflow-x:auto来防止页面宽度溢出,以及实现左右滚动效果 2、::-webkit-scrollbar { display: none;}隐藏
阅读全文
摘要://识别并转换文本里的超链接 transSlink(value){ let reg = /(http:\/\/|https:\/\/|www)((\w|=|\?|\.|\/|&|~|-|[\u200B-\u200D\uFEFF])+)/g; let text = value.replace(reg,
阅读全文
摘要:###1、引入VantUi的List组件 ``` 安装步骤见官网:https://vant-contrib.gitee.io/vant/next/#/zh-CN/quickstart 或移步https://www.cnblogs.com/huihuihero/p/11418541.html,搜索va
阅读全文
摘要:因使用ui组件存在一些兼容性问题,故找到以下方法略加改动实现效果 本文转自:https://www.jianshu.com/p/a9e1cf8efbf3 略作改动
阅读全文
摘要:``` isWeChat(){ let ua = navigator.userAgent.toLowerCase(); if (ua.match(/MicroMessenger/i) == "micromessenger") { this.iswx = true //微信端 } else { this.iswx = false; //非微信端 } }, ```
阅读全文
摘要:####兼容方式(仅适用于移动端,pc端对ie浏览器兼容不友好) IE:不管该行有没有文字,光标高度与font-size大小一致 FF:该行没有文字时,光标大小与input的 height 大小一致;该行有文字时,光标大小与font-size大小一致 chrome:有2种情况,①设置了line-he
阅读全文
摘要:###ios端与安卓端的时间兼容问题 ####对于 2020-02-02 20:20:20 这种格式的时间 主要问题是:ios端不支持2020-02-02 20:20:20这种以-分割的时间格式。ios端仅支持2020/02/02 20:20:20这种以/分割的时间格式。而安卓端及pc端这两种格式的
阅读全文
摘要:####经过处理了各种bug后的最终版本代码 在index.html: 引入 <script type="text/javascript" src="https://res2.wx.qq.com/open/js/jweixin-1.6.0.js"></script> 在需要做分享功能的页面: cre
阅读全文
摘要:流程: ① 请求微信接口(携带指定参数appid,scope等。及一个回调地址redirect_uri) ② 微信收到请求后会跳转到回调地址redirect_uri,并在该回调地址上携带相关回调参数 ③ 提取相关回调参数传给后台即可 1、获取网页授权(官方文档:https://developers.
阅读全文
摘要:##具体流程(详见文档:https://developers.weixin.qq.com/doc/offiaccount/OA_Web_Apps/Wechat_webpage_authorization.html) ####1、前端提交申请获取用户授权 let ua = navigator.user
阅读全文
摘要:###推荐这种方式 https://www.cnblogs.com/huihuihero/p/13024701.html ####ios微信内置浏览器默认是白色背景底色;而安卓机微信内置浏览器默认是灰色背景底色。底色不同导致h5页面在不同机型的微信浏览器内打开,显示效果不同。如何兼容? 推荐上面链接
阅读全文
摘要:####登录成功后跳转回上一页而非主页 评论页: sendComment(){ axios.get(`${common.commentapi}/comment?aid=${this.aid}`).then(res=>{ if(res.data.code==200){ this.$toast({ me
阅读全文
摘要:视频插件vue video player的使用及注意事项 视频插件xgplayer(西瓜播放器)的使用及注意事项 更多详情见官方文档:http://h5player.bytedance.com/ 贴代码: 1、安装包:npm install xgplayer 2、代码部分: //1、标签,必须要有
阅读全文
摘要:####配置路径@(一般情况下搭建vue-cli,项目已经配置好了@路径。若自己需要改动可按照一下方法) ``` vue-cli 2.x 版本创建项目时,我们可以在 build 文件夹下找到 webpack.base.conf.js 文件,在里面修改 resolve.alias 即可 resolve
阅读全文
摘要:####适配配置完成后需重启项目才会生效 ###移动端适配vue-cli3.0 ######第一种方案(常用)——px转rem适配方案: 【第1步、使用pxtorem px转成rem】——让网页根据设备dpr和宽度,利用viewport和html根元素的font-size配合rem来适配不同尺寸的移
阅读全文
摘要:移动端编写部署 移动站适配基础知识点 跳转代码(PC端修改) 跳转适配 PC和移动代码标示,让百度蜘蛛很容易来识别是PC站还是移动站 网站禁止转码 拓展阅读 https://ziyuan.baidu.com/college /type=3&cate=mobile
阅读全文