element UI Popover 彈出框裡一帶有下拉屬性觸發彈窗進行關閉以及位置偏移的情況問題解決方法

摻半N發表於2022-11-23

常見問題解決方法(百度搜羅出來的,文章底部是原文連結具體可移步原文章查閱):
select上可以設定:popperAppendToBody="false"
時間元件選擇可以選teleported
el-date-picker 下拉出現偏移的設定 (:append-to-body="false")
其他的element 元件下拉出現位置偏移:也可以透過
:append-to-body="false" 或 :popper-append-to-body="false" 進行設定

原理:預設配置中,在使用到選擇器元件時,一旦點選下拉選項,popover就會消失,這很明顯不是我們想要的實現效果。
在hover=“click”的popover中,元件的顯示與否,主要看滑鼠click點選時的標籤是否對應的彈出框中。如果不是的話就會隱藏,如果是的話,就不會隱藏,懂了這個邏輯,我們就應該去看一下官網是不是有對應的屬性提供給我們。
可以看到,組建中的popperAppendToBody屬性決定了對應的彈框append到哪個父節點上。
預設的話是body,如果這個屬性改成false就變成了append到對應的select標籤下面。
這個時候點選下拉選項中的內容,也相當於是在對應的父彈框中點選,而不是append到body中的標籤,自然剛剛開啟的popover也就不會消失了。

原文連結:https://blog.csdn.net/m0_5622...
原文連結:https://blog.csdn.net/qq_4460...

相關文章