**JAreaSelect省市縣三級聯動組件** [TOC] ## 參數定義 | 參數名 | 類型 | 默認值 | 必填 | 說明 | |----------------|--------|----------|------|-----------------------------------| | value(v-modal) | String | | 是 | 綁定值 | | province| String | | 是 | 綁定省份 | | city| String | | 是 | 綁定城市 | | area| String | | 是 | 綁定地區 | | level | number | | 3 | 省市區級聯層級 | ## 使用示例 - 返回單值  ~~~ <template> <a-form style="height:800px"> <a-row class="form-row" :gutter="16"> <a-col :lg="8"> <a-form-item label="省市區級聯單選" :label-col="{ span: 6 }" :wrapper-col="{ span: 15 }"> <JAreaSelect v-model:value="pop"/> </a-form-item> </a-col> <a-col :lg="8"> <a-form-item label="省市區級聯單選數值" :label-col="{ span: 6 }" :wrapper-col="{ span: 15 }"> <span>{{pop}}</span> </a-form-item> </a-col> </a-row> </a-form> </template> <script lang="ts" setup> import {ref,reactive} from 'vue' import {JAreaSelect} from '/@/components/Form'; const pop = ref('') </script> ~~~ - 返回多值  ~~~ <template> <a-form style="height:800px"> <a-row class="form-row" :gutter="16"> <a-col :lg="8"> <a-form-item label="省市區級聯多選" :label-col="{ span: 6 }" :wrapper-col="{ span: 15 }"> <JAreaSelect v-model:province="pca.province" v-model:city="pca.city" v-model:area="pca.area"/> </a-form-item> </a-col> <a-col :lg="8"> <a-form-item label="省市區級聯多選數值" :label-col="{ span: 6 }" :wrapper-col="{ span: 15 }"> <span>{{pca}}</span> </a-form-item> </a-col> </a-row> </a-form> </template> <script lang="ts" setup> import {ref,reactive} from 'vue' import {JAreaSelect} from '/@/components/Form'; const pca = reactive({ province:'', city:'', area:'' }) </script> ~~~