React-Redux connect（）不更新組件，即使當狀態改變時沒有突變

我有這個codepen，其中store.subscribe()工作和connect()不起作用。具體來說，組件不會更新新的道具。我認爲connect（）的淺平等檢查可能會忽略這種變化，所以我懷疑狀態變異。但是，我正在使用Immutable.js來處理reducer中的狀態變化，並且我也在我的訂閱方法中進行了自己的ref檢查，並且每次更新都會發生很小的差異。我覺得像明顯的東西必須在這裏失去了...React-Redux connect（）不更新組件，即使當狀態改變時沒有突變

組件：

class App extends React.Component{ 
    ... 
} 

const mapStateToProps = state => ({ 
    alerts: state.alerts 
}); 

const mapDispatchToProps = dispatch => ({ 
    onAlert: (type, autoHide, message) => 
    dispatch({ type: 'SHOW_ALERT', payload: { message, type, autoHide } }) 
}); 

const ConnectedApp = connect(mapStateToProps, mapDispatchToProps)(App);

減速機：

const alertsReducer = (alerts=Immutable.List(), { type, payload }) => { 
    switch (type){ 
    case 'SHOW_ALERT': 
     if (!payload.message || R.trim(payload.message).length === 0){   
     throw new Error('Message cannot be empty.'); 
     } 
     return alerts.push(payload); 
    default: 
     return alerts; 
    } 
};

商店：

const store = createStore(combineReducers({ alerts: alertsReducer }), applyMiddleware(ReduxThunk.default));

渲染：

//** THIS DOESN'T WORK 
// ReactDOM.render(<Provider store={store}><ConnectedApp /></Provider>, document.getElementById('main')); 

//** THIS WORKS 
store.subscribe(()=>{ 
    render(); 
}); 
const render =() => { 
    ReactDOM.render(<App {...store.getState()} onAlert={ 
     (type, autoHide, message) => store.dispatch({ type: 'SHOW_ALERT', payload: { message, type, autoHide } }) 
     }/>, document.getElementById('main')); 
}; 
render();

這是因爲頂級狀態對象仍然具有相同的引用嗎？我嘗試刪除Immutable.js，並使整個狀態的數組與reducer每次都返回一個新的數組。這仍然沒有奏效。

版本：

[email protected] 
[email protected] 
[email protected]

來源

2016-08-20 goldbullet

，如果你打開控制檯，會出現錯誤

addComponentAsRefTo（...）：只有ReactOwner可以有裁判。你可能增加一個裁判，這不是一個組件的render方法內創建一個組件，或者你有多個副本的陣營加載

解決這個問題，你應該https://cdnjs.cloudflare.com/ajax/libs/react/15.3.1/react-with-addons.min.js 和 https://cdnjs.cloudflare.com/ajax/libs/react/15.3.1/react.js之間進行選擇，因爲React應該添加到頁面一次。

之後，您需要添加來自react-redux的Provider。您還需要在列表中添加關鍵道具。

改變筆http://codepen.io/anon/pen/dXLQLv?editors=0010

來源

2016-08-20 17:31:06

我知道這是愚蠢的東西...謝謝！ – goldbullet

React-Redux connect（）不更新組件，即使當狀態改變時沒有突變

回答

相關問題