uniapp项目开发总结

一、项目介绍

     一款基于js,vue,uniapp技术栈开发的医疗app,供国外华人使用。

二、项目依赖参考资料，ui库等外部资源

　　1.https://uniapp.dcloud.net.cn/quickstart-hx.html（uniapp官方开发文档），https://www.html5plus.org/doc/h5p.html（h5联盟）开发app可参考，https://ask.dcloud.net.cn/article/35621(dcloud社区打开外部应用)

　　2.https://www.uviewui.com/components/intro.html（uView官方开发文档），坑点较多建议采用uniapp官方组件

　　3利用谷歌api根据经纬度获取城市信息（由于墙墙的原因需要外网）

　　4.推荐阅读的优秀个人博客，uniapp开发总结：https://juejin.cn/post/6919341967432220679，运行打包版本更新总结：https://juejin.cn/post/7037033560343068708#heading-27，uniapp请求封装：https://juejin.cn/post/6971256379046641672

三、开发过程踩坑总结

　　3-1.页面样式以及html标签问题

　　　  1.css单位采用upx、rpx实现不同机型的适配，css推荐使用scss结构清晰；页面滚动效果建议采用uniapp滚动容器组件，min-height,max-with等样式使用起来挺方便。布局建议采用flex，更易适配多端。

　　　  2.html标签问题，所有标签应采用uniapp自带组件标签实现，web原生标签使用会有很多兼容问题。

　　3-2环境api异同

　　　　相同点：uniapp支持大部分vue的api，原生的js不支持window、document、navigator等浏览器专用对象,开发web端、小程序(本质也是web)，完全支持，乱写就对了

　　　　不同点（坑点）：

　　　　　　1.网络请求，应放弃aixos,$.ajax请求，在app端存在兼容性问题，应采用uniapp提供的原生方法uni.request方法，自行封装后也很方便，

　　　　　　2.页面跳转不要采用vue原生跳转，在app上不兼容，采用官方提供的跳转方法

　　　　　　3.数据缓存、路由拦截应采用uniapp语法，浏览器window等对象不能用

　　　　　　4.plus对象开发app存在的对象，其他端不支持，需进行条件编译或获取设备信息后判断。

四、打包注意事项

　　manifest.json文件中进行，app图标项目名等配置，打包app是app权限配置每个第三方sdk代表一个权限功能，例如拨打电话功能需勾选，若未勾选即使调用了对应api打包后也不会生效