来客推移动端开发规范
1、遵循 vue 官方风格指南
2、必须
style 标签必须加上 scoped
style 标签不加上 scoped 会导致不同页面之间的样式互相影响
好例子
<style lang="less" scoped>
.a {
/deep/ .b {
background: red;
}
}
</style>
反例
<style lang="less">
.b {
background: red;
}
</style>
引入图片文件必须使用线上路径
在vue 文件里面引入本地文件的方式在 App 中无法打开
3、强烈推荐
请求接口尽量使用 this.$req.post() 方法
好例子
laiketuiCommon.vue 文件
Vue.prototype.$req.post({data})
反例
uni.request({
url: me.$store.state.url,
data,
success: function (res) {
resolve(me)
},
fail (res) {
reject(res)
}
})
使用公共方法进行页面的跳转
参考 doc/navigator.md 文件
好例子
<text @click="navTo('/pagesB/setUp/paymentPassword')">{{language.paymodel.forgot}}</text>
反例
<text @click="forgetPW">{{language.paymodel.forgot}}</text>
.
.
.
forgetPW: function () {
uni.navigateTo({
url: '../../pagesB/setUp/paymentPassword'
})
}
4、推荐
尽量使用 async 函数来代替原来的 Promise 语法
好例子
class Demo {
async index () {
await this.f1();
await this.f2();
await this.f3();
console.log('f1 f2 f3 都执行完了')
}
async f1 () {
return new Promise.resolve()
}
async f2 () {
return new Promise.resolve()
}
f3 () {
return new Promise.resolve()
}
}
反例
class Demo {
async index () {
this.f1().then(() => {
this.f2().then(() => {
this.f3().then(() => {
console.log('f1 f2 f3 都执行完了')
})
})
})
}
async f1 () {
return new Promise.resolve()
}
async f2 () {
return new Promise.resolve()
}
f3 () {
return new Promise.resolve()
}
}
函数命名如非必要不要使用 _xxx 函数命名
目前的项目没有使用 class 的继承特性，用 mixins 的地方也比较少，_函数一般都是只在当前类当中生效，privite 方法，目前的vue文件基本每个文件都是独立的每个方法都是方法没有继承关系，就不要用下划线加函数名称的方式命名了
封装的组件在时间允许的情况下尽量把原来需要更换的也换了
时间不允许就另说了
一个列表页应包含以下组件
- toload
- heads
- uni-load-more
- 为空判断
5、不推荐
不要在 vue 文件里面写存纯js
components/laiketuiCommon.vue 应该拆分成 config.js 和 common.js
lktauthorize 验证登录的使用
请谨慎使用验证登录功能，无效的校验只会白白的消耗请求资源，例如在个人中心已经登录了。在进订单的时候校验了用户是否登录，进了订单页面再校验一次，到了订单详情再校验一次。这就是属于无效的校验
推荐：在已经登录了的页面就不进行校验，过期了通过接口来进行判断。
如非必要请不要使用 let me = this 这样的语法
作用域的问题使用箭头函数
好例子
class Demo {
constructor() {
this.a = ''
}
async index () {
this.f1(() => {
this.a = 'xx'
})
}
f1 (callback) {
}
}
反例
class Demo {
constructor() {
this.a = ''
}
async index () {
let me = this;
this.f1(function () {
me.a = 'xx'
})
}
f1 (callback) {
}
}
如需引入外部的js，需要共享当前对象使用 mixins
