# CChinaArea 中国地区选择器组件

## 功能说明

CChinaArea 是一个中国地区选择器组件，用于在表单中选择省市区地址。组件内置了完整的中国行政区划数据，支持省、市、区三级联动选择，并且可以设置默认值和只读模式。

## 引用方式

```js
import { CChinaArea } from '@components/forms/chinaArea';
```

## 组件参数

- `itemRes` (Object，必填)：表单数据资源对象，表单组件内部机制专用
- `level` (Number，可选)：选择层级，可选值为 1（省）、2（省市）、3（省市区），默认为 3
- `placeholder` (String，可选)：选择器占位提示文本
- `readOnly` (Boolean，可选)：只读模式，默认为 false
- `separator` (String，可选)：地址文本分隔符，默认为空格
- `defaultCode` (String，可选)：默认选中的区域编码

## 使用示例

### 基础用法

```html
<template>
  <CForm :form="form">
    <CFormItem name="address" label="所在地区">
      <CChinaArea 
        placeholder="请选择所在地区" 
      />
    </CFormItem>
  </CForm>
</template>

<script>
import { CForm, CFormItem } from '@components/forms/form';
import { CChinaArea } from '@components/forms/chinaArea';

export default {
  components: {
    CForm,
    CFormItem,
    CChinaArea
  },
  data() {
    return {
      form: {
        address: {
          province: '',
          city: '',
          district: '',
          code: ''
        }
      }
    };
  }
};
</script>
```

### 自定义配置

```html
<CFormItem name="region" label="配送区域">
  <CChinaArea 
    :level="2" 
    separator="/" 
    defaultCode="330100" 
    placeholder="请选择配送区域" 
  />
</CFormItem>
```

## 注意事项

1. 组件返回的数据格式为对象，包含以下字段：
   - `province`：省份名称
   - `city`：城市名称
   - `district`：区县名称（仅在 level=3 时有值）
   - `code`：选中区域的行政区划代码
2. 可以通过 `defaultCode` 设置默认选中的区域
3. `level` 参数决定了选择的层级：
   - 1：仅选择省份
   - 2：选择省份和城市
   - 3：选择省份、城市和区县
4. 组件会根据当前选择自动联动更新下级选项
5. 在只读模式下，地址信息将以文本形式显示，使用 `separator` 分隔