uni-app中的城市三级联动

import mpvueCityPicker from '@/components/uni-ui/mpvue-citypicker/mpvueCityPicker.vue';

components:{
      mpvueCityPicker,
    },

<mpvue-city-picker :themeColor="themeColor" ref="mpvueCityPicker" :pickerValueDefault="cityPickerValueDefult" @onCancel="onCancel" @onConfirm="onConfirm"></mpvue-city-picker>

data() {
      return {
        themeColor:'#007AFF',
        cityPickerValueDefult:[0,0,1],
        pickerText:'',
                
      }
    },

// 三级联动提交
      onConfirm(e){
        this.pickerText = e.label;
      },

<uni-list-item title="家乡" :rightText="pickerText" @click="showCityPicker"></uni-list-item>

showCityPicker(){
        this.$refs.mpvueCityPicker.show();
      },

        // 监听返回
    onBackPress() {
      if(this.$refs.mpvueCityPicker.showPicker){
        this.$refs.mpvueCityPicker.pickerCancel();
        return true;
      }
    },// 监听页面卸载
    onUnload() {
      if(this.$refs.mpvueCityPicker.showPicker){
        this.$refs.mpvueCityPicker.pickerCancel()
      }
      if(this.$refs.mpvueCityPicker.showPicker){
        this.$refs.mpvueCityPicker.pickerCancel()
      }
    },