vue3 组件-省市区城市选择器
该组件依赖element-plus。
基础用法
vue
<script setup lang="ts">
import { SelectAreaEmits, KSelectArea } from "@tomiaa/vue3-components"
const change: SelectAreaEmits["change"] = data => {
console.log(data)
}
</script>
<template>
<KSelectArea @change="change" />
</template>按需引入
vue
<script setup lang="ts">
import { KSelectArea } from "@tomiaa/vue3-components"
</script>属性
| 属性 | 说明 | 类型 | 必填 |
|---|---|---|---|
| provinceAttrs | 省下拉框属性，el-select 的属性 | Object | 否 |
| cityAttrs | 市下拉框属性，el-select 的属性 | Object | 否 |
| areaAttrs | 区下拉框属性，el-select 的属性 | Object | 否 |
事件
| 事件名 | 说明 | 参数 | TS 类型 |
|---|---|---|---|
| change | 最后一项下拉框选择后 | (data: SelectAreaChange) | SelectAreaEmits["change"] |
类型声明
ts
import type {
SelectAreaProps, // 属性声明
SelectAreaEmits, // 事件声明
} from "@tomiaa/vue3-components"
// SelectAreaProps["属性名"]
// SelectAreaEmits["事件名"]
// const prop: SelectAreaProps["属性名"] = xxx
// const func: SelectAreaEmits["事件名"] = function