推荐插件 https://ext.dcloud.net.cn/plugin?id=4375
支持微信小程序 App nvue vue
<lhSelectCity
:value="value"
:windowHeight="windowHeight"
:hotCitys="hotCitys"
@onSelect="onSelectCity"
/>
## 参数说明
hotCitys 热门城市
value 当前选中城市
windowHeight scroll的高 也是滑块的高 记得带单位!!! px rpx upx都支持
@onSelect 点击切换城市事件 参数为城市名称
import lhSelectCity from '@/components/lh-select-city/index.nvue'
export default {
components:{lhSelectCity},
data() {
return {
hotCitys: [
'杭州',
'天津',
'北京',
'上海',
'深圳',
'广州',
'成都',
'重庆',
'厦门'
],
value: '杭州',
windowHeight:""
}
},
onLoad(){
// 计算出可用高度
this.windowHeight = uni.getSystemInfoSync().windowHeight-100+"px";
},
methods: {
onSelectCity(city) {
//切换城市事件
console.log(city)
}
}
}
作者是本人市面上兼容nvue的太少了就自己写了一个
有需要改进的或者意见都可以留言给我 尽力满足大家需求