<template> <view> <view class="width100 backcorfff"> <!-- <uSearchBar @confirm="search" @input="input"></uSearchBar> <view class="line1 mart10"></view> --> <view class="width90 mart20 font15 fcor333">当前定位</view> <view class="posacname actives mart20">{{posName}}</view> <view class="width90 mart20 font14 fcor333">其他地区</view> <view class="posheadname mart20 flleft font14" :class="{'actives':posId===item.regionId}" v-for="(item,index) in posList" :key="index" @click="change(item)"> {{item.regionName}} </view> </view> </view> </template> <script> import uSearchBar from '../../../components/uni-search-bar/components/uni-search-bar/uni-search-bar.vue'; import { getDredgeProvince } from '../../../Utils/Api.js'; let app = getApp(); export default { components: { uSearchBar }, data() { return { posList: [], posId: '', posName: '' } }, onLoad() { this.getDredgeProvince(); this.posName = app.globalData.cityName; }, methods: { getDredgeProvince() { uni.showLoading({ title: '加载中' }) getDredgeProvince().then(res => { uni.hideLoading() if (res.return_code == '000000') { this.posList = res.return_data; } }); }, change(item) { this.posId = item.regionId; this.posName = item.regionName; app.globalData.cityId = item.regionId; app.globalData.cityName = item.regionName; uni.navigateBack({ }) } } } </script> <style lang="less"> .posheadname { background-color: #f5f5f5; color: #666666; padding-left: 10px; padding-right: 10px; height: 30px; margin-left: 4%; line-height: 30px; text-align: center; border-radius: 5px; } .posacname { background-color: #f5f5f5; color: #666666; display: inline-block; padding-left: 10px; padding-right: 10px; height: 30px; margin-left: 4%; line-height: 30px; text-align: center; border-radius: 5px; } .actives { color: #089bf5; background-color: #f4faff; border: 1px solid #089bf5; } </style>