# 公共组件文档

### 组件规范

**1. 组件目录命名规范要求，采用小写 `kebab-case` 命名，如下：**

✅ 正例：`shopping-car / waterfall / goods-list`

❌ 反例：`ShoppingCar / Waterfall / GoodsList`

```
shopping-car
  ├── README.md
  ├── index.json
  ├── index.ts
  ├── index.wxml
  └── index.wxss

waterfall
  ├── README.md
  ├── index.json
  ├── index.ts
  ├── index.wxml
  └── index.wxss
```

**2. 组件分成两类：全局基础组件(`free-[component-name]`)、全局业务组件(`biz-[component-name]`)，引入组件时，须加上类型标识**

```JSON
// 基础组件
"usingComponents": {
  "free-waterfall": "../../components/waterfall/waterfall",
}
```

```JSON
// 业务组件
"usingComponents": {
  "biz-goods-list": "../../components/waterfall/waterfall",
}
```

```html
<!-- 基础组件  -->
<free-waterfall>
  <!-- content  -->
</free-waterfall>

<!-- 业务组件  -->
<biz-goods-list>
  <!-- content  -->
</biz-goods-list>
```

### 组件列表

**基础组件**

- [瀑布流组件](./waterfall/README.md)
- [地址选择弹窗组件](./area-picker/README.md)
- [自定义导航栏](./navigation/README.md)
- [图片滑动选择组件](./scroll-image-tab/README.md)

**业务组件**

- [商品列表组件]()(示例)