最近的一个微信端vue项目,出现了很多问题,总结一下
vue项目配置
- 用vue-cli脚手架搭建的项目,导入该有的各种需要包之后npm run dev,不知道是vue-cli的版本问题还是webpack的版本问题,出现了找不到css-loader和vue-loader的报错,导入成功后再运行还是这样的错。
解决: 建立的默认vue文件,css预设的需要改一下 - 在package.json文件的script中的dev里面添加
--host 当前ip
就可以用手机端访问,如: - 在config的index.js中的proxyTable可以代理后端api,如:
微信签名问题
- 正常的签名,需要获取当前页面的url地址,并调用微信接口,如:
- 不同的分享页面会进入不同的链接:用watch监听路由$route,并判断url地址有没有需要的关键字
- 分享的图片要缩小,80*80左右
- 分享的图片自己可以看到,别人看不到,一般是因为分享的标题或描述中有部分关键字,如:红包、现金、福利...
页面问题
1. 字体阴影
普通字体阴影:
text-shadow: 0 2px 1px #A0522D //只能让字体阴影投影到一边(x坐标,y坐标,阴影范围,颜色)
字体四周阴影:
text-shadow: 0 2px 1px #A0522D, 2px 0 1px #A0522D, -2px 0 1px #A0522D, 0 -2px 1px #A0522D
2. 模态框
子组件中的模态框就算设置了fixed;top:0;left: 0;盖不住父组件的问题
-->解决:将模态框写到页面根组件中,不写在子组件里面
3. 图片按钮
将图片当做按钮时,部分手机(oppo,魅族)有时候点击时会把图片点击放大,写了阻止默认事件也没有用。
-->解决:用button代替img,把图片当做button的背景图片。
这样,本来定宽不定高的img现在宽高都需要定义,不同手机可能会将图片压扁或拉伸。
-->再解决:设置background-size的时候,用contain,宽高碰到就不在扩大了
4. iphone图片时不时消失
不知道什么问题,iphone有的型号、有的时候、有的图片显示不出来
-->解决:懵逼
数据请求
!!!一定要和后端明确,不要想当然!!!
!!!一定要有个好的命名习惯(属性用下划线,方法用驼峰)!!!
!!!属性、方法、关键步骤一定要写注释!!!
注:本文内容来自互联网,旨在为开发者提供分享、交流的平台。如有涉及文章版权等事宜,请你联系站长进行处理。