问题
最近一朋友问了个兼容性问题就是，elementUI的el-cascader组件，当设置filterable属性后，在IE上会出现自动展开下拉框的问题。网上找了一些方法 感觉没什么效果，就想到一个取巧的方法。
解决代码
<el-cascader
ref="cascader"
:options="options"
:props="props"
filterable
@visible-change="visibleChange"
collapse-tags
clearable>
</el-cascader>
export default {
name: 'SdtDetail',
components: {
SdtFooter,
PlusOrder,
SdtReplace,
inventedTable
},
data () {
return {
props: { multiple: true },
options: [{
value: 1,
label: '东南',
children: [{
value: 2,
label: '上海',
children: [
{ value: 3, label: '普陀' },
{ value: 4, label: '黄埔' },
{ value: 5, label: '徐汇' }
]
}, {
value: 7,
label: '江苏',
children: [
{ value: 8, label: '南京' },
{ value: 9, label: '苏州' },
{ value: 10, label: '无锡' }
]
}, {
value: 12,
label: '浙江',
children: [
{ value: 13, label: '杭州' },
{ value: 14, label: '宁波' },
{ value: 15, label: '嘉兴' }
]
}]
}, {
value: 17,
label: '西北',
children: [{
value: 18,
label: '陕西',
children: [
{ value: 19, label: '西安' },
{ value: 20, label: '延安' }
]
}, {
value: 21,
label: '新疆维吾尔自治区',
children: [
{ value: 22, label: '乌鲁木齐' },
{ value: 23, label: '克拉玛依' }
]
}]
}],
numfirst: 0
}
},
methods: {
isIE() { //ie?
if (!!window.ActiveXObject || "ActiveXObject" in window){
return true;
}else{
return false;
}
},
visibleChange(flag){ // 联机框展示影藏变化时触发方法
let isIE = this.isIE()
if (flag && this.numfirst ===0 && isIE ) { // 判断第一次且是的IE浏览器的情况下收回下拉框
this.$refs.selectLLLL.dropDownVisible = false
this.numfirst = 1
}
},
}
}