Select

下拉列表模式，最传统，经典的应用形式

组件引用

在项目中引入组件

import { RegionSelects, RegionFullSelects } from 'v-region'

实例

关闭城市级别，仅选择省份

<RegionSelects :city="false" />

请选择

关闭区县级别

<RegionSelects :area="false" />

请选择

请选择

<RegionSelects />

请选择

请选择

请选择

使用完整的 4 级行政区划

<RegionFullSelects />

请选择

请选择

请选择

请选择

响应数据

v-model values

{}

change event response results

{}

初始值绑定

指定一套地区编码值，使组件默认显示这些地区

<template>
  <RegionFullSelects v-model="region" />
</template>
<script setup lang="ts">
import { ref } from 'vue'
import { RegionFullSelects } from 'v-region'
import type { RegionValues } from 'v-region'
const region = ref<RegionValues>({
  province: '350000',
  city: '350100',
  area: '350104',
  town: '350104008'
})
</script>

请选择

请选择

请选择

请选择

清空/重置

指定一个各级别的值为 undefined 的对象，即可清空

region.value = {
  province: undefined,
  city: undefined,
  area: undefined,
  town: undefined
}

注意

传递 undefined 值或是一个空对象 {}，无法清空

禁用状态

<RegionFullSelects
  v-model="values"
  :disabled="true"
/>

请选择

请选择

请选择

请选择