Avue 表单字段 动态下拉处理 及联动下拉处理
Avue 表单字段 动态下拉处理及联动下拉处理export const tableOption = {border: true,index: true,selection: true,indexLabel: '序号',stripe: true,menuAlign: 'center',align: 'center',dialogClickModal: false,searchMenuSpan: 6,
·
Avue 表单字段 动态下拉处理及联动下拉处理
export const tableOption = {
border: true,
index: true,
selection: true,
indexLabel: '序号',
stripe: true,
menuAlign: 'center',
align: 'center',
dialogClickModal: false,
searchMenuSpan: 6,
labelWidth: 100,
column: [{
type: 'input',
label: 'id',
prop: 'id',
hide: true,
editDisabled: true,
editDisplay: false,
addDisplay: false
},
{
// 一级下拉
type: 'select', // 字段类型
label: '适用省份', // label 名称
prop: 'ssProvince', // 与后台交互的 属性名
cascaderItem: ['ssCity'], // 用于 二级下拉框 的key值
dicUrl: '/stl/stlregion/parentCode/100000', // 动态字典 接口
props: { // 字典接口返回对象格式 {name:"",code:""}
label: 'name',
value: 'code'
},
rules: [{ // 必填校验
required: true,
message: '请选择省份',
trigger: 'change'
}],
search: true
}, {
// 二级下拉
type: 'select', // 字段类型
label: '适用地市', // label 名称
prop: 'ssCity', // 与后台交互的 属性名
props: { // 字典接口返回对象格式 {name:"",code:""}
label: 'name',
value: 'code'
},
rules: [{
required: true,
message: '请选择市区',
trigger: 'change'
}],
dicUrl: '/stl/stlregion/parentCode/{{key}}', // 动态字典接口 其中 {{key}} 为一级下拉框 的动态下拉值(value值)
search: true
}
]
}
更多推荐
已为社区贡献2条内容
所有评论(0)