爲動態存儲屬性指定reducer

Question

我想弄清楚如何在我的狀態樹中從用戶事件創建的屬性中設置reducer。

我的狀態樹是這個樣子：

{ 
    session: { session object }, 
    dashboard: { 
    id: 'id001', 
    charts: { 
     'cid001': { dimensions: { ... }, more objects... }, 
     'cid002': { dimensions: { ... }, more objects... } 
    } 

    } 
} 

新charts性能通過Redux的進來，當用戶點擊添加按鈕圖表。密鑰設置爲圖表編號cid。

我目前使用combineReducers()來設置reducer樹。

import session from './session'; 
import charts from './charts'; 

const rootReducer = combineReducers({ 
    session, 
    dashboard: combineReducers({ 
    charts 
    }); 
}); 

如果提前知道屬性名稱，我可以像這樣嵌套縮減器。但是，我想避免爲charts屬性設置一個大型縮減器，因爲它內部的每個圖表最多可以有多達20個需要減少的對象，dimensions只是一個示例。

有沒有辦法爲charts['cidxxx'].dimensions和其他子屬性設置縮減器？有通配符令牌嗎？有什麼想法嗎？

Answer 1

對象傳播對於這樣的事情會很好。

function chartsReducer(state, {payload}) { 
    const {cid} = payload; 
    const currentChart = state[cid] || {}; 
    return {...state, [cid]: {...currentChart, ...payload}}; 
} 

如果您正在尋找去物業樹方面比較深的，它可能是值得思考如何改變你的數據的形狀，以匹配你如何使用它。