Bootstrap

JK——vue+element 级联选择器(数据处理)

1、方法一

<el-cascader
							 v-model="value" ref="cascaderAddr"
						    :options="this.treedata"
						    :props="optionProps"
						    clearable @visible-change="getTree()" @change="setTree()"></el-cascader>
return {
				value: [],
				options: [],
				optionProps: {
				          value: 'fId',//fId——后台字段名
				          label: 'fName',
				          children: 'children',
				          checkStrictly: true,
				          multiple: true,
				        },
}
//方法里
getTree() {
//数据太多导致页面空白时加loding
        if (this.treedata == '') {
					var loading = this.$loading({
						lock: false, // 是否锁屏
						text: 'Loading', // 加载动画的文字
						// spinner: 'el-icon-loading',// 引入的loading图标
						target: document.querySelector('.el-cascader-panel'), // 需要遮罩的区域
					});
					// setTimeout(() => {// 设定定时器,超时5S后自动关闭遮罩
;