elementUI级联选择器el-cascader组件踩坑

项目测试过程中出现了一个bug：elementUI级联选择器el-cascader组件做了一个省市县三级联动且可以选择任意一级选项，但选择任意省市县之后，获取不到选择的值。

问题代码

HTML

<el-cascader
	v-model="userForm.regionArr"
	:options="options_area"
	:props="{ checkStrictly: true, value: 'name', label: 'name' }"
	clearable
	@change="handleChangeRegion"
></el-cascader>

JS

watch: {
	"userForm.regionArr": {
		immediate: true,
		deep: true,
		handler(newVal) {
			// 这里的log没有任何输出
			console.log(newVal);
		},
	},
},

注意点

需要注意的是，我这里是用了vue的watch进行了监听，但可惜的是并没什么效果，导致功能无法实现，大概率是elementUI组件上设计的问题。

解决方案

直接用elementUI提供的change事件代替即可；