优秀的项目源码,即使是多人开发,看代码也如出一人之手。统一的编码规范,可使代码更易于阅读,易于理解,易于维护。严格按照**ESLint**格式要求编写代码
* 采用ES6的风格编码
* 调试信息console.log() debugger 使用完及时删除
* prop 定义应该尽量详细
~~~
prop 的定义应该尽量详细,至少需要指定其类型。
~~~
~~~
// 正例
props: {
status: String
}
// 更好的做法!
props: {
status: {
type: String,
required: true,
validator: function (value) {
return [
'syncing',
'synced',
'version-conflict',
'error'
].indexOf(value) !== -1
}
}
}
~~~
~~~
// 反例
props: ['status']
~~~
* 避免 v-if 和 v-for 用在一起
~~~
一般我们在两种常见的情况下会倾向于这样做:
* 为了过滤一个列表中的项目 (比如 v-for="user in users" v-if="user.isActive")。在这种情形下,请将 users 替换为一个计算属性 (比如 activeUsers),让其返回过滤后的列表。
* 为了避免渲染本应该被隐藏的列表 (比如 v-for="user in users" v-if="shouldShowUsers")。这种情形下,请将 v-if 移动至容器元素上 (比如 ul, ol)。
~~~
* 多个特性的元素 换行写
~~~
// 正例
<img
src="https://vuejs.org/images/logo.png"
alt="Vue Logo"
>
<MyComponent
foo="a"
bar="b"
baz="c"
/>
// 反例
<img src="https://vuejs.org/images/logo.png" alt="Vue Logo">
<MyComponent foo="a" bar="b" baz="c"/>
~~~
**为了提高开发效率应使用IDE进行开发,使用IDE插件进行自动格式化,团队各成员IDE配置应相同。**