# CChinaArea 中国地区选择器组件

## 功能说明

CChinaArea 是一个中国地区选择器组件，用于在表单中选择省市区地址。组件内置了完整的中国行政区划数据，支持省、市、区(街道)多级联动选择，并且可以通过地理定位自动获取当前位置。

## 引用方式

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

## 组件参数

- `itemRes` (Object，必填)：表单数据资源对象，表单组件内部机制专用
- `autoGeo` (Boolean，可选)：是否自动通过地理定位获取省市区，默认为 false
- `level` (Number，可选)：联动级别，默认为 3
  - `3`：省市区三级联动
  - `4`：省市区街道四级联动
- `placeholder` (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: []
      }
    };
  }
};
</script>
```

### 四级联动

```html
<CFormItem name="region" label="详细区域">
  <CChinaArea 
    :level="4" 
    placeholder="请选择所在区域" 
  />
</CFormItem>
```

### 自动获取地理位置

```html
<CFormItem name="location" label="当前位置">
  <CChinaArea 
    :autoGeo="true" 
    placeholder="正在获取位置..." 
  />
</CFormItem>
```

## 注意事项

1. 组件返回的数据格式为数组，包含选中的地区名称：
   - 三级联动：`['浙江省', '杭州市', '西湖区']`
   - 四级联动：`['浙江省', '杭州市', '西湖区', '文三路街道']`
2. 当启用地理定位功能（`autoGeo=true`）时，组件会尝试获取当前位置的省市区信息
3. 组件会根据当前选择自动联动更新下级选项
4. 地区数据源来自内置的中国行政区划数据
5. 位置信息在表单中显示时，地址各级之间会以 ` / ` 分隔