shop-app/README.md

<!--
 * @Author: ch
 * @Date: 2022-03-17 11:30:06
 * @LastEditors: ch
 * @LastEditTime: 2022-05-23 21:18:34
 * @Description: file content
-->

# shopping-app

严选移动端

## 前置环境

由于项目依赖问题，开发 `node` 版本必须是 `14` or `16`。

如果想安装多个版本，可以通过使用 `nvm` 进行版本管理。然具体安装可以参考下面教程

[window install nvm](https://juejin.cn/post/7074108351524634655)
[mac install nvm](https://juejin.cn/post/7206882855200047161)

## 公共方法 utils

- 公共方法统一放置 utils 文件夹内，可以按分类建方法文件 如：验证类 verify.js 请求类 request.js；
- 所有公共方法采用大驼峰命名法
- 所有的方法都从 index.js 输出，引入时统一引入 index，不允许直接引入方法文件
- 所有方法文件如果导出的是多个方法，不允许在定义方法时导出，必须在文件底部一一导出，并附上方法简单的注释

```js
// 正确
import {Req, IsPhone} from '@/common/utils';

// 错误
import {Req} from '@/common/utils/request';
import {IsPhone} from '@/common/utils/utils';

// 正确
const IsPhone = (str) => {....}
const IsEmail = (str) => {....}
export {
	// 判断手机号
	IsPhone,
	// 判断邮箱
	IsEmail
}

// 错误
export const IsPhone = (str) => {....}
export const IsEmail = (str) => {....}

```

## 组件

- 请务必使用 easycom 模式引入第三方组件
- 根目录的 components 只放置真正的组件，某个页面的业务模块应该在 pages 的相应目录下新建 components 目录放置
- 所有的自定义组件文件名以大驼峰命名，且在 templet 中使用也用大驼峰形式使用

## 请求

- 所有请求方法命名以（Api+请求类型+具体方） 法命名
- 所有请求使用 ToAsyncAwait 包裹
- 不允许使用 try catch 和 then 处理返回结果

```js
// 使用示例
	// xxapi.js
	import {ToAsyncAwait, ReqestTk} from '@/common/utils'
	const ApiGetUserInfo = (parapms) => ToAsyncAwait(ReqestTk.get('xxxxUrl',{params}));
	exprot {
		// 获取用户信息
		ApiGetUserInfo
	}
	// user.vue
	improt {ApiGetUserInfo} from '@/common/api/xxapi.js';

	const getUserInfo = async () =>{
		const {error, result} = await ApiGetUserInfo();
		if(error){
			alert(error);
			return false;
		}
		app.userInfo = result;
	}

```

## 图片

- 按 pages 目录结果放置图片
- 有公共使用的图片请放到 static/common 文件夹内