在做項目的時候,有一個功能是需要調用后台接口,來顯示el-cascader,返回的數據,一個是嵌套的二維數據,另一個就是返回的對象數組了
當前面的下拉菜單選擇完畢后,值也正常賦進去,刷新的時候,也沒有問題,一到選擇數據的時候,請求搜索的接口,直接報錯
根據報錯信息點進去看了一下,發現cascader有選中項的綁定值checkedValue和點擊的父節點(高亮)activePath ,就算設置了this.cascaderValue= []
,
cascader中的activePath還是有值,也就是點擊的父節點會被記錄下來,再次加載cascader找不到就會報錯。
解決:
在推薦的博客中,看到 給cascader設置一個key,改變類型時也改變key值,key值改變了,cascader就會重新渲染
data中設置cascaderKey默認為1,
然后再請求的接口中,設置 ++this.cascaderKey
當options變化時,改變key值
,進而實現組件重新渲染