鍍金池/ 問答/HTML/ reducer返回的對(duì)象為空時(shí)，組件中監(jiān)聽不到state的變化

reducer返回的對(duì)象為空時(shí)，組件中監(jiān)聽不到state的變化

最近學(xué)習(xí)用react開發(fā)一個(gè)后臺(tái)系統(tǒng)，要求有多窗口功能，我是打算用antd的tabs來模擬?，F(xiàn)在遇到一個(gè)問題，就是在我刪除最后一個(gè)tab時(shí)無法觸發(fā)redux。

tabList.js

clipboard.png

點(diǎn)擊左邊的菜單會(huì)生成對(duì)應(yīng)的tab標(biāo)簽，這個(gè)過程分別會(huì)發(fā)一個(gè)action給redux生成新的state返回給組件，同時(shí)也會(huì)把相關(guān)數(shù)據(jù)保留到localstorage中，處理刷新頁面當(dāng)前tab還在。當(dāng)標(biāo)簽頁有多個(gè)時(shí)，點(diǎn)擊刪除正常刪除。但當(dāng)只剩最后一個(gè)標(biāo)簽，點(diǎn)擊刪除，頁面上的標(biāo)簽頁被刪除了，但沒觸發(fā)componentDidUpdate。導(dǎo)致我拿不到最新的state，也就無法存入localstorage中。刷新頁面后始終有一個(gè)tab標(biāo)簽。

clipboard.png

點(diǎn)擊刪除按鈕觸發(fā)remove方法。該方法會(huì)把一個(gè)關(guān)鍵key傳入reducer中

clipboard.png

上圖的console.log在刪除最后一個(gè)tab時(shí)不觸發(fā)。

reducers.js

clipboard.png

點(diǎn)擊刪除action.type為REM_tabList，接收到一個(gè)key同state中的數(shù)據(jù)對(duì)比，key相同則刪除對(duì)應(yīng)數(shù)據(jù)。此時(shí)當(dāng)state為[]時(shí)，在reducers.js中答應(yīng)state能正常打印出[]，而tabList.js中的mapStateToProps中的console.log(state)卻未執(zhí)行。

ps：嘗試了使用在connect()()中使用深對(duì)比也沒用。

回答
編輯回答
汐顏

你直接改變了原來的reducers里的state的引用，redux檢測(cè)不到變化了吧
直接

return state.filter(xxxxxx)

試試

2018年5月20日 09:29