html
<el-cascader v-model="form_area" :props="optionProps" filterable ref="myCascader" @change="areaChage"></el-cascader>
data中
form_area:{},//存储获取的省市区
optionProps: { //配置节点
emitPath: false,
lazy: true,
lazyLoad: ((node, resolve) => {
const level = node.level
var url = '__CONTROLLER__/dcCommonRequest'
let params = {}
let result = []
if (this.form_area.xiugai) {
//修改时走
params.provincesFilters = 'provincesFilters'
params.action_name = 'provinceRows'
this.ajax('post', url, params, (res) => {
var result1
result1 = res.data.rows
result1.forEach(item => {
item.value = JSON.stringify(item.id)
item.label = item.name
})
result = result1
})
params.action_name = 'cityRows'
params.provinceId = this.form_area.prov
this.ajax('post', url, params, (res) => {
var result2
result2 = res.data.rows
result2.forEach(item => {
item.value = JSON.stringify(item.id)
item.label = item.name
})
for (let i = 0; i < result.length; i++) {
if (result[i].id == this.form_area.prov) {
result[i].children = result2
console.log(result[i])
}
}
})
params.action_name = 'areaRows'
params.cityId = this.form_area.city
this.ajax('post', url, params, (res) => {
if (res.data.rows == '') {
params.provinceId = this.form_area.prov
params.cityId = this.form_area.city
params.action_name = 'townRows'
this.ajax('post', url, params, (res) => {
var result2
result3 = res.data.rows
result3.forEach(item => {
item.value = JSON.stringify(item.id)
item.label = item.name
item.leaf = true
})
})
} else {
var result2
result3 = res.data.rows
result3.forEach(item => {
item.value = JSON.stringify(item.id)
item.label = item.name
item.leaf = true
})
for (let i = 0; i < result.length; i++) {
if (result[i].id == this.form_area.prov) {
for (let e = 0; e < result[i].children.length; e++) {
if (result[i].children[e].id == this.form_area.city) {
result[i].children[e].children = result3
}
}
}
}
}
})
this.form_area.xiugai = false
resolve(result)
} else {
//新增时走
if (level === 0) {
params.provincesFilters = 'provincesFilters'
params.action_name = 'provinceRows'
}
if (level === 1) {
params.action_name = 'cityRows'
params.provinceId = node.value
this.form_area.prov = node.value
}
if (level === 2) {
params.action_name = 'areaRows'
params.cityId = node.value
this.form_area.city = node.value
}
this.ajax('post', url, params, (res) => {
if (level === 0 || level === 1) {
result = res.data.rows
result.forEach(item => {
item.value = item.id
item.label = item.name
})
}
if (level === 2) {
if (res.data.rows == '') {
params.provinceId = this.form_area.prov
params.cityId = this.form_area.city
params.action_name = 'townRows'
this.ajax('post', url, params, (res) => {
result = res.data.rows
result.forEach(item => {
item.value = item.id
item.label = item.name
item.leaf = level >= 1
})
})
} else {
result = res.data.rows
result.forEach(item => {
item.value = item.id
item.label = item.name
item.leaf = level >= 1
})
}
}
resolve(result)
})
}
})
},
默认赋值方法:给v-model绑定的值赋值如下格式
form_area.area = ["140000", "140200", "140212"]