更新记录
0.0.1(2024-02-05)
下载此版本
城市二级选择弹窗组件
平台兼容性
uni-app
Vue2 |
Vue3 |
Chrome |
Safari |
app-vue |
app-nvue |
Android |
iOS |
鸿蒙 |
√ |
√ |
√ |
- |
√ |
- |
- |
- |
- |
微信小程序 |
支付宝小程序 |
抖音小程序 |
百度小程序 |
快手小程序 |
京东小程序 |
鸿蒙元服务 |
QQ小程序 |
飞书小程序 |
快应用-华为 |
快应用-联盟 |
√ |
√ |
√ |
√ |
√ |
√ |
- |
√ |
√ |
√ |
√ |
其他
qs-address
一、组件使用说明
目前组件仅支持省市二级选择,支持返回位置的经纬度、城市名称、城市code、拼音如果需要三级联动组件支持可扩展,需自行实现。
属性 |
类型 |
描述 |
:show(v-model:how) |
Boolean |
是否显示弹窗组件 |
@onSelectCity |
Handler |
返回选择的城市数据 |
popularCities |
[String,String] |
设置热门城市选项可自定义配置 例子( ['北京', '天津', '上海', '深圳', '西安', '郑州', '运城']) |
currentCity |
String |
获取选择当前位置的信息 |
页面中使用
<template>
<qs-address
v-model:show="selectorVisible"
@onSelectCity="City"
:currentCity="currentCity" />
</template>
<script lang="ts" setup>
const currentCity = ref("西安市") // 当前城市
const selectorVisible = ref(false) // 是否显示弹窗组件
function City({ detail }) {
console.log("城市信息", detail)
}
</script>