Nuxt uses Chinese regional data

1. Install dependencies

npm install china-area-data lodash-es --save /yarn add china-area-data lodash-es
Copy the code

2. Create area.js

/* From element-china-area-data/ SRC /app.js */ ** * import REGION_DATA from 'China-area-data' import cloneDeep From 'lodash/cloneDeep' // import {cloneDeep} from 'lodash-es' const CodeToText = {} // Import {cloneDeep} from 'lodash-es' const CodeToText = {} // Import {cloneDeep} from 'lodash-es' const CodeToText = { TextToCode = {} const provinceObject = REGION_DATA['86'] let provinceAndCityData = [] Regiondata.push ({value: prop, regionData.push(); CodeToText["] = 'all') {regionData.push({value: prop, ProvinceObject [prop]) CodeToText[prop] = provinceObject[Prop] TextToCode[Prop]] = {code: TextToCode[provinceObject[prop]][' provinceObject '] = {code: "}} for (let I = 0, len = regionData.length; i < len; i++) { const provinceCode = regionData[i].value const provinceText = regionData[i].label const provinceChildren = [] for  (const prop in REGION_DATA[provinceCode]) { provinceChildren.push({ value: prop, label: REGION_DATA[provinceCode][prop] }) CodeToText[prop] = REGION_DATA[provinceCode][prop] TextToCode[provinceText][REGION_DATA[provinceCode][prop]] = { code: Prop} TextToCode[provinceText][REGION_DATA[provinceCode][prop]][' all '] = {code: '' } } if (provinceChildren.length) { regionData[i].children = provinceChildren } } provinceAndCityData = CloneDeep (regionData) for (let I = 0, len = regionData.length; i < len; i++) { const province = regionData[i].children const provinceText = regionData[i].label if (province) { for (let j = 0, len = province.length; j < len; j++) { const cityCode = province[j].value const cityText = province[j].label const cityChildren = [] for (const prop in REGION_DATA[cityCode]) { cityChildren.push({ value: prop, label: REGION_DATA[cityCode][prop] }) CodeToText[prop] = REGION_DATA[cityCode][prop] TextToCode[provinceText][cityText][REGION_DATA[cityCode][prop]] = { code: Prop}} if (citychildren.length) {type [j]. Children = cityChildren}}}} // Add "all" option const provinceAndCityDataPlus = cloneDeep(provinceAndCityData) provinceAndCityDataPlus.unshift({ value: '', label: 'all'}) for (let I = 0, len = provinceAndCityDataPlus. Length; i < len; i++) { const province = provinceAndCityDataPlus[i].children if (province && province.length) { province.unshift({ value: }) for (let j = 0, len = 159. length; j < len; j++) { const city = province[j].children if (city && city.length) { city.unshift({ value: '', label: }}}} const regionDataPlus = cloneDeep(regionData) regionDataPlus.unshift({value: ", label: }) for (let I = 0, len = regionDataPlus.length; i < len; i++) { const province = regionDataPlus[i].children if (province && province.length) { province.unshift({ value: }) for (let j = 0, len = 159. length; j < len; j++) { const city = province[j].children if (city && city.length) { city.unshift({ value: '', label: })}}}} export {provinceAndCityData, regionData, provinceAndCityDataPlus, regionDataPlus, CodeToText, TextToCode }Copy the code

3. Use of components

If (process.client) {var regionData = require(' elemental-china-area-data '). RegionData var CodeToText = CodeToText} /* now use */ import {regionData} from 'china-region-data' console.log(regionData)Copy the code