如果给过来的不是地址的索引，而是地址呢

[vini123]

通常数据库中不会存 插件返回过来的索引。虽然，插件也会返回完整的地址。

假如数据库中存的用户地址是: 上海市-直辖市-徐汇区，初始化插件的时候，又该如何在 show 的时候就定位到这里呢。这个就是再次编辑的需要。而这里没有很好的提供到。我需要使用这个插件，又不能完全满足我的需要，就稍微改了一点。

在 props 中额为定义了一个 address 。使用 watch 监听它。在 引用页面对 address 进行赋值。比如我点击地址准备编辑的时候。一旦对 address 赋值，插件就会获取到，然后再调用插件里边的方法。新增的方法就可以。(VUE 我是新手，本来想找在引用页面调用插件里边的方法，没找到，只好出此下策)

watch: {
address: function() {
if (!this.address)
return;

		let addressArr = this.address.split('-');
		let temp;
		
		if(addressArr.length >= 3) {
			temp = this.addressIndex(addressArr[0], addressArr[1], addressArr[2]);
		}
	  else if(addressArr.length == 2) {
			temp = this.addressIndex(addressArr[0], addressArr[1]);
		} else if(addressArr.length == 1) {
			temp = this.addressIndex(addressArr[0]);
		}
		
		this.pickerValueDefault = temp;
		this.initialize();
	}

},

methods:

addressIndex(province, city, area) {
let provinceIndex, cityIndex, areaIndex = 0;

if(!province)
	return [provinceIndex, cityIndex, areaIndex];	 
		
for (var index in provinceData) {
	if (provinceData[index]['label'] == province) {
		provinceIndex = parseInt(index);
		break;
	}
}                                                         

if (!city)
	return [provinceIndex, 0, 0];
		
for (var index in cityData[provinceIndex]) {
	if (cityData[provinceIndex][index]['label'] == city) {
		cityIndex = parseInt(index);
		break;
	}
}

if(!area) 
	return [provinceIndex, cityIndex, 0];
		
for (var index in areaData[provinceIndex][cityIndex]) {
	if (areaData[provinceIndex][cityIndex][index]['label'] == area) {
		areaIndex = parseInt(index);
		break;
	}
}

return [provinceIndex, cityIndex, areaIndex];			

},

initialize () {
this.handPickValueDefault();
this.provinceDataList = provinceData;
this.cityDataList = cityData[this.pickerValueDefault[0]];
this.areaDataList =
areaData[this.pickerValueDefault[0]][this.pickerValueDefault[1]];
this.pickerValue = this.pickerValueDefault;
},

[lincenying]

<template>
<mpvue-city-picker
                                v-if="mpVueInit"
                                ref="mpvueCityPicker"
                                :pickerValueDefault="mpVueRegion"
                                @onChange="bindRegionChangeH5"
                                @onCancel="() => {}"
                                @onConfirm="region = mpVueTmpRegion"
                            ></mpvue-city-picker>
                            <text v-if="region.length" @click="$refs.mpvueCityPicker.show()" class="f-30">{{ regionStr }}</text>
                            <text v-else @click="$refs.mpvueCityPicker.show()" class="f-30 col-7">选择省、市、区</text>
</template>
<script>
import mpvueCityPicker from 'mpvue-citypicker'
import province from 'mpvue-citypicker/src/city-data/province'
import city from 'mpvue-citypicker/src/city-data/city'
import area from 'mpvue-citypicker/src/city-data/area'

export default {
    components: {
        mpvueCityPicker
    },
    data() {
        return {
            region: [],
            mpVueTmpRegion: [],
            mpVueRegion: [0, 0, 0],
            mpVueInit: false
        }
    },
    computed: {
        regionStr() {
            if (Array.isArray(this.region)) return this.region.join(',')
            return ''
        }
    },
    onLoad() {
        App._get_address(result => {
                    if (result.data.region) {
                        const p = result.data.region[0]
                        const c = result.data.region[1]
                        const a = result.data.region[2]
                        let [pIndex, cIndex, aIndex] = [0, 0, 0]
                        if (p) {
                            pIndex = province.findIndex(item => item.label === p)
                            if (pIndex < 0) pIndex = 0
                        }
                        if (c) {
                            cIndex = city[pIndex].findIndex(item => item.label === c)
                            if (cIndex < 0) cIndex = 0
                        }
                        if (a) {
                            aIndex = area[pIndex][cIndex].findIndex(item => item.label === a)
                            if (aIndex < 0) aIndex = 0
                        }
                        this.mpVueRegion = [pIndex, cIndex, aIndex]
                        this.mpVueInit = true
                    }
                }
            )
    },
    methods: {
        bindRegionChangeH5(e) {
            this.mpVueTmpRegion = (e.label && e.label.split('-')) || []
        },
    }
}
</script>