使用DCloud旗下的uniapp框架开发移动端的app应用 - [生活街APP](你的生活小助手)

使用DCloud旗下的uniapp框架开发移动端的app应用 - [生活街APP](你的生活小助手)

简介:

生活街(Street Life)是一款O2O(online to offline)模式的,以附近线上实体商店预览交互,线下交易选购的生活服务类APP .简介详情

项目目录:

├─appInfo 存放应用的一些介绍信息,演示,截图等 ├─components 公用组件目录 ├─mockJson 测试的模拟json数据文件 ├─common 存放全局的一些js变量配置, /style下存放iconfont字体图标样式 ├─pages 业务页面文件存放的目录 ├─static 存放应用引用静态资源（如图片等）的地方，注意：静态图片只能存放于此 ├─main.js Vue初始化入口文件 ├─App.vue 应用配置，用来配置App全局样式以及监听 应用生命周期 ├─manifest.json 配置应用名称、appid、logo、启动图、版本,权限等打包信息 ├─pages.json 配置页面路由、导航条、选项卡等页面类信息 └─uni.scss uni-app内置的常用scss样式变量

APP平台适配:

如何运行:

提示:

运行到真机测试HbuildeX会自动在你的手机上安装HBuilder调试基座,并且微信QQ登录授权/高德地图SDK都是使用官方调试基座的.

目前后端还未完成,所以暂时使用了模拟JSON数据, 因为这款App我打算是以安卓为主, 所以多是在安卓上测试开发, H5和小程序也能运行,但在安卓上有更完善的功能和体验. 当前Master分支的版本会一直作为模拟Json数据的测试版本, 后期联调后端的版本会push到dev分支. 因为目前Master分支的项目代码只是初期完成测试的第一版本, 代码中仍有许多TODO,和需要优化的地方,在联调后端的分支dev将会完善这些TODO. 本项目的代码可能存在一些设计不合理的地方,一部分原因是uniapp多端兼容问题,以及uniapp的api调用, 页面路由跳转上的一些小问题, 这让你不得不去绕路妥协这些问题,另外我也只是一个小白,个人开发确实很难,看这个项目的代码质量算是很真实吧(-ˍ-), 所以我在项目中整合使用了一些比较好的官方/个人贡献者的组件(官方的插件市场可以搜到). 另外本项目只是我根据自己提的简介需求来完成的,只是作为练手项目和学校的作品赛之类的,并不会作为线上产品.

页面截图:

(页面截图来自安卓机型: 小米6 (其他机型暂未测试,各位可以自行测试一下), 项目引用的图片都来自网络, 图标icon来自阿里iconfont)

总结:

uniapp这个框架还不是很成熟, 虽然可以实现一次开发,编译到多端运行, 但是运行在各个端时有时会有点小问题, 如果你是只适配一个端,那就比较轻松, 所以建议在入坑前一定要仔细了解一下官方文档,可以避免不少坑, 而且uniapp编译运行到安卓端,视图层是运行在WebView容器上的,性能不如原生安卓组件,不过你也可以使用原生Weex(nvue)组件代替vue组件,可以提升性能,但在nvue和vue页面间数据通信又不方便,且nvue的模板较少,所以要根据实际情况选用. 如果要说优点,那就是uniapp是一个跨多端的框架,而且有不错的贡献者和热度以及组件插件模板. 不要一个人开发.

(文档持续更新中...)

补充:

当前项目如果发现可优化,欢迎大家提issue改进.

后端目前正在开发中: 生活街App后端.

版权声明：本文内容由网络用户投稿，版权归原作者所有，本站不拥有其著作权，亦不承担相应法律责任。如果您发现本站中有涉嫌抄袭或描述失实的内容，请联系我们jiasou666@gmail.com 处理，核实后本网站将在24小时内删除侵权内容。