![](https://img-blog.csdnimg.cn/20201014180756925.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
H5&微信
珞珈山小鲁班
前端小渣渣,每天都想有点进步的小鲁班
展开
-
vue2.x+vantUI搭建移动端并适配750设计稿
文章目录前言一、学习目标二、创建vue项目1.文件夹下创建新的项目2.读入数据总结前言本文在已安装node、npm、vue-cli等前提下进行,请确保自己的node -v,npm -v和vue -V是正常显示版本的以下是环境和命令:node环境(自带npm)npm install webpack -gnpm install --global vue-cli一、学习目标搭建vue移动端项目框架vantUI按需引入开发设配750设计稿二、创建vue项目1.文件夹下创建新的项目vue原创 2022-04-29 15:59:05 · 761 阅读 · 0 评论 -
ios返回只显示部分数据,轻触或滑动页面出现完整数据
问题场景:ios从详情页放回当前列表页后,只显示下半部分列表,上半部分不展示,需要用手稍微滑动下页面才能完全展示当前页面,见下图:原因分析:从当前页面顶部进入详情返回后未出现该问题;从当前页面滑到底部进入详情返回后必现该问题。1.尝试在离开路由前beforeRouterLeave,通过设置document.documentElement.scrollTop和document.body.scrollTop均为0,只第一次成功,估计有缓存,导致问题还是出现;2.上一步怕是有缓存,尝试在详情页返原创 2022-02-18 14:01:54 · 1483 阅读 · 0 评论 -
elementUI下拉点击两次才会被选中 & 曲面屏滑动直接滑出页面
项目场景:要求:使用同一个项目放在web端显示web内容和样式,放在H5显示H5内容和样式,一开始使用elementUI开发的,功能不复杂,因此不引入vant,使用elementUI问题描述:在写选择下拉选择框时,使用电脑浏览器代理没问题,安卓也没问题,ios会出现下拉选择点两次才会出现在选择框内 解决方案:修改css .el-scrollbar { > .el-scrollbar__bar { opacity: 1 !important; }}测试,完美,以原创 2021-07-14 19:00:57 · 796 阅读 · 0 评论 -
移动端-适配(px转rem)
做了两个移动端项目,一个静态,一个vue静态:在html页面head标签里计算,一般设计图是750,width/7.5即在设计图上测量px单位的尺寸,然后除以100转换成rem单位后直接使用就可以了<script> var html = document.querySelector('html'); changeRem(); window.addEventListener('resize', changeRem); fu原创 2020-09-04 11:27:11 · 368 阅读 · 0 评论 -
vconsole-vue移动端调试工具&微信开发者工具
前言:在做微信公众号的项目,由于需要微信环境,只能在微信中打开,但是手机端不能看到调试页面的内容1 安装vsoncolenpm install vconsole2 引入(index.js或者main.js)import vConsole from 'vconsole'Vue.prototype.$vConsole= new vConsole()3 运行之后,报错发现缺少对应的.min.js,在index.html中引入<script src="https://cdn.bootcss.原创 2020-09-10 14:31:49 · 639 阅读 · 0 评论 -
微信动态修改头部
背景:开发微信公众号项目,跳转不同模块需要展示不同的头部名称方法:使用vue-wechat-title插件实现:安装npm vue-wechat-title --save引入-在src下的index.js中引入import VueWechatTitle from 'vue-wechat-title';Vue.use(VueWechatTitle);路由中定义meta中的title在App.vue中使用<router-view v-wechat-title="原创 2021-05-17 09:59:46 · 132 阅读 · 0 评论