开发规范

uniapp官方开发文档

文档地址:https://uniapp.dcloud.io/

uni-app规范

为了实现多端兼容,综合考虑编译速度、运行性能等因素,uni-app 约定了如下开发规范:

  • 页面文件遵循 Vue 单文件组件 (SFC) 规范
  • 组件标签靠近小程序规范,详见uni-app 组件规范
  • 接口能力(JS API)靠近微信小程序规范,但需将前缀 wx 替换为 uni,详见uni-app接口规范
  • 数据绑定及事件处理同 Vue.js 规范,同时补充了App及页面的生命周期
  • 为兼容多端运行,建议使用flex布局进行开发

业务规范

一、所有请求后端api的操作都需在api目录里新建对应的js文件

例如:/api/address.js

  1. import request from '@/utils/request'
  2. // api地址
  3. const api = {
  4. list: 'address/list',
  5. add: 'address/add'
  6. }
  7. // 收货地址列表
  8. export const list = (param) => {
  9. return request.get(api.list, param)
  10. }
  11. // 新增收货地址
  12. export const add = (data) => {
  13. return request.post(api.add, { form: data })
  14. }

二、request请求必须使用https

同时在小程序管理员后台配置可进行request请求的域名白名单

  1. // 错误的
  2. apiUrl: "http://www.yoshop.cn/index.php/api/"
  3. // 正确的
  4. apiUrl: "https://www.yoshop.cn/index.php/api/"

三、所有的业务页面都应在pages目录下

例如:pages/index/index.vue 商城首页
例如:pages/goods/list.vue 商品列表页

四、每个端,有每个端的管理规则,这不是uni-app在技术层面上可以抹平的:

  • 比如H5端的浏览器有跨域限制;
  • 比如微信小程序会强制要求https链接,并且所有要联网的服务器域名都要配到微信的白名单中;
  • 比如App端,iOS对隐私控制和虚拟支付控制非常严格;
  • 比如App端,Android、国产rom各种兼容性差异,尤其是因为谷歌服务被墙,导致的push、定位等开发混乱的坑;
  • 如果你的App要使用三方sdk,比如定位、地图、支付、推送…还要遵循他们的规则和限制;