# cloud_countryside

**Repository Path**: WaitingForBlowing/cloud_countryside

## Basic Information

- **Project Name**: cloud_countryside
- **Description**: No description available
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2021-04-07
- **Last Updated**: 2021-04-09

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# 云上乡村微信小程序

## 编码规范

### 1.目录规范

- 组件文件

  所有组件相关文件统一放在components目录下。

- 静态资源

  项目静态资源放置于根目录的static文件夹下

- 模型文件

  模型文件主要用于编写各类业务模型。项目模型文件放置于根目录的models文件夹下，组件相关模型放置于components目录下的models文件夹中。

- 行为文件

  行为文件放在所引用的组件目录下。

### 2、WXML规范

*缩进统一使用两个空格* 

wxml标签可以单独出现的情况，尽量单独出现，如<input />。

> <input />

控制每行HTML的代码数量在50个字符以内，方便阅读浏览，多余的代码进行换行处理，标签所带属性每个属性间进行换行。

```html
<v-music
  wx:if="{{classic.type===200}}"
  img="{{classic.img}}"
  content="{{classic.content}}"
\>
</v-music>
```

合理展现分离内容，不要使用内联样式。

```html
//推荐使用
<image class="tag"></image>
```

### 3.CSS规范

在开发过程中rpx和px均可能用到，需要适配必须用rpx

CSS代码需有明显的代码缩进，左大括号前留一个空格，每一个样式类之间空出一行。

```css
.v-tag {
  width: 100%;
}

.v-container {
  width: 100%;
}
```

尽量使用简写属性，并且同一属性放置在一起，避免散乱，类名的多个单词间使用 - 分割，不要使用驼峰

```css
/**使用简写属性**/
.v-image {
  margin: 0 auto;
}

/**同一属性放在一块**/
.v-tag {
  margin-left: 10rpx;
  margin-right: 10rpx;
}
```

采用flex进行布局，禁止使用float以及vertical-align。

```css
container {
  disaplay: flex;
  flex-dirextion: row;
}
```

### 4.Javascript规范

### 命名规范

变量名以及函数名统一采用驼峰命名法，正常情况下函数名前缀需加上清晰的动词表示函数功能，私有函数或者属性以下划线开头表明。常量需用const 声明。

类的命名首字母需大写。

采用ES6 关键字let定义变量，尽量不使用var

```javascript
//定义常量
const a = 1

//定义变量
let imageContent =  res.data

//函数命名
getInfo() {
  return '';
}

//私有函数
_getInfo() {
  return '';
}
```

### 回调函数规范

回调函数统一使用Promise函数的方式进行编写，回调成功的参数统一为res，错误参数为err。

```javascript
// promise 处理回调
let back = new Promise((resolve, reject) => {
  if (/* 异步操作成功 */){
    resolve(value);
  } else {
    reject(error);
  }
});
back()
  .then(res => {
  	  console.log('成功回调！', res);
  })
  .catch(err => {
  	console.log('失败回调！', error);
  });
```

私有函数以及回调函数统一放置在生命周期函数后。

删除js文件中未用到的生命周期函数，保持代码的整洁。

每个函数之间用一个空行分离结构。

### 数据绑定变量定义规范

所有涉及到数据绑定的变量均需在data中初始化。禁止在不定义的情况下直接setData。

### 点击事件规范

点击事件函数命名方式为 on + 事件名 或者业务名。

```javascript
onLike(event) {
}
```

### 标点规范

JS语句无需以分号结束，统一省略分号

WXML、CSS、JSON中均应使用双引号。

CSS属性中冒号中后面用一个空格分隔开。

执行一致的缩进（2个空格）

执行一致的换行样式（'unix'）

## UI组件库

- Vant（https://youzan.github.io/）

## 开发人员

- MoozLee