Ui
yfx
2026-03-13 ce71ac1ec3c725d10af689dd5716ba7ad4109958
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
<template>
  <view>
    <uv-picker :immediateChange="false" visibleItemCount="5" round="16" ref="areasDome" keyName="name" :loading="loading" :columns="addressList" @confirm="confirm"></uv-picker>
  </view>
</template>
 
<script>
import { getAreaList } from "@/api/modules/user";
 
export default {
  props: {
    cityCode: {
      type: String,
      default: ''
    }
  },
 
  data() {
    return {
      loading: true,
      addressList: [],
      codes: '',
      cachedCityCode: '' // 用于缓存 cityCode 或 codes
    };
  },
  created() {
    this.cachedCityCode = this.cityCode || this.codes;
    this.getAreaList();
  },
  watch: {
    cityCode(newVal) {
      if (newVal !== this.cachedCityCode) {
        this.cachedCityCode = newVal;
        this.getAreaList();
      }
    }
  },
  methods: {
    setCityCode(codes) {
      if (codes !== this.cachedCityCode) {
        this.cachedCityCode = codes;
        this.getAreaList();
      }
    },
    open() {
      this.$refs.areasDome.open();
    },
    getAreaList() {
      this.loading = true;
      getAreaList({ cityCode: this.cachedCityCode })
          .then(res => {
            if (Array.isArray(res) && res.length > 0) {
              this.addressList = [[...res]]
            } else {
              this.addressList = [];
            }
            this.loading = false;
          })
          .catch(error => {
            this.loading = false;
          });
    },
    confirm(e) {
      this.$emit('confirm', e);
    }
  }
};
</script>