解決el-cascader在IE11瀏覽器中加載頁(yè)面自動(dòng)展開下拉框問(wèn)題
問(wèn)題
最近一朋友問(wèn)了個(gè)兼容性問(wèn)題就是,elementUI的el-cascader組件,當(dāng)設(shè)置filterable屬性后,在IE上會(huì)出現(xiàn)自動(dòng)展開下拉框的問(wèn)題。網(wǎng)上找了一些方法 感覺(jué)沒(méi)什么效果,就想到一個(gè)取巧的方法。
解決代碼
<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: '無(wú)錫' }
]
}, {
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: '新疆維吾爾自治區(qū)',
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){ // 聯(lián)機(jī)框展示影藏變化時(shí)觸發(fā)方法
let isIE = this.isIE()
if (flag && this.numfirst ===0 && isIE ) { // 判斷第一次且是的IE瀏覽器的情況下收回下拉框
this.$refs.selectLLLL.dropDownVisible = false
this.numfirst = 1
}
},
}
}以上就是解決el-cascader在IE11瀏覽器中加載頁(yè)面自動(dòng)展開下拉框問(wèn)題的詳細(xì)內(nèi)容,更多關(guān)于el-cascader IE11加載下拉框的資料請(qǐng)關(guān)注腳本之家其它相關(guān)文章!
相關(guān)文章
vue+elementUI 實(shí)現(xiàn)內(nèi)容區(qū)域高度自適應(yīng)的示例
這篇文章主要介紹了vue+elementUI 實(shí)現(xiàn)內(nèi)容區(qū)域高度自適應(yīng)的示例,幫助大家更好的理解和使用vue,感興趣的朋友可以了解下2020-09-09
vue打印瀏覽器頁(yè)面功能的兩種實(shí)現(xiàn)方法
這篇文章主要給大家介紹了關(guān)于vue打印瀏覽器頁(yè)面功能的兩種實(shí)現(xiàn)方法,這個(gè)功能其實(shí)也是自己學(xué)習(xí)到的,做完也有一段時(shí)間了,一直想記錄總結(jié)一下,文中通過(guò)實(shí)例代碼介紹的非常詳細(xì),需要的朋友可以參考下2023-04-04
vuecli4插件svg-sprite-loader使用svg圖標(biāo)
這篇文章主要為大家介紹了vuecli4插件svg-sprite-loader使用svg圖標(biāo)示例詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-08-08
vue3+ts項(xiàng)目中.env配置環(huán)境變量與情景配置方式
本文介紹了如何在Vite中配置環(huán)境變量和不同的運(yùn)行模式,環(huán)境變量文件以.env開頭,僅VITE_前綴的變量會(huì)被暴露,開發(fā)模式加載.env.development,生產(chǎn)模式加載.env.production,NODE_ENV用于區(qū)分開發(fā)和生產(chǎn)環(huán)境2024-10-10
詳解利用 Vue.js 實(shí)現(xiàn)前后端分離的RBAC角色權(quán)限管理
本篇文章主要介紹了利用 Vue.js 實(shí)現(xiàn)前后端分離的RBAC角色權(quán)限管理,非常具有實(shí)用價(jià)值,需要的朋友可以參考下2017-09-09

