// component/select-district/select-district.js const district = require('../../data/district.js').list; Component({ /** * 组件的属性列表 */ properties: { }, /** * 组件的初始数据 */ data: { district, province: [], city: [{ "cityCode": '', "cityName": '不限市', }], area: [{ "countryCode": '', "countryName": '不限区域', }], province_id: '', city_id: '', area_id: '', province_name: '不限省', city_name: '不限市', area_name: '不限区域', }, attached() { let province = this.data.district.map(val => ({ "provinceCode": val.provinceCode, "provinceName": val.provinceName, "firstNameLetter": val.firstNameLetter, })) province.unshift({ "provinceCode": '', "provinceName": '不限省', }) this.changeCity('320000'); this.changeArea('320000', '320200'); this.setData({ province, province_id: '320000', city_id: '320200', }) }, /** * 组件的方法列表 */ methods: { changeCity(id) { let city = null; this.data.district.forEach((val, key) => { if (val.provinceCode === id) { city = val.cityList.map(value => ({ "cityCode": value.cityCode, "cityName": value.cityName, "firstNameLetter": value.firstNameLetter, })) } }) city.unshift({ "cityCode": '', "cityName": '不限市', }) this.setData({ city, area: [{ "countryCode": '', "countryName": '不限区域', }], city_id: '', area_id: '', }) }, changeArea(id, code) { let area = null; this.data.district.forEach((val, key) => { if (val.provinceCode === id) { val.cityList.forEach(value => { if (value.cityCode === code) { area = value.areaList.map(val => val) } }) } }) area.unshift({ "countryCode": '', "countryName": '不限区域', }) this.setData({ area }) }, // 选择地区 chooseDistrict(e) { const id = e.currentTarget.dataset.id; const name = e.currentTarget.dataset.name; const district = e.currentTarget.dataset.district; if (district === 'province') { id !== '' && this.changeCity(id); id === '' && this.setData({ city_id: '', city_name: '不限市', area_id: '', area_name: '不限区域', city: [{ "cityCode": '', "cityName": '不限市', }], area: [{ "countryCode": '', "countryName": '不限区域', }], }) } if (district === 'city') { id !== '' && this.changeArea(this.data.province_id, id); id === '' && this.setData({ area_id: '', area_name: '不限区域', area: [{ "countryCode": '', "countryName": '不限区域', }], }) } this.setData({ [`${district}_id`]: id, [`${district}_name`]: name, }) }, // 提交选择后的信息 submit() { const { province_id, city_id, area_id, province_name, city_name, area_name, } = this.data this.triggerEvent('submit', { province_id, city_id, area_id, province_name, city_name, area_name, }) }, // 关闭选择框 colose() { this.triggerEvent('colose') }, } })