鍍金池/ 問(wèn)答/HTML/ redux里如何處理數(shù)據(jù)?

redux里如何處理數(shù)據(jù)?

具體場(chǎng)景如下:

// reducer.js
const initialState = {
    test: [
        {    
            id: 1
            show: true    
        },
        {    
            id: 2
            show: true    
        },
        {    
            id: 3
            show: true    
        }
    ]
}
export function testUp(state=initialState, action) {
    switch (action.type) {
        case UPDATE: {
          return {
            ...state,
            // ...action.payload, 正常情況應(yīng)該這樣,但是我需要處理cidList
            takeCidList(state.test, action.payload)
          }
        }
        default:
          return state
      }
}
function takeCidList(test, cidList) {
    const list = []
    // todo get initialState.test
    return list
}

// test.jsx
class Test extends Component {
    // ...
    updateTestState = idList => {
        this.props.updateTestState(idList)
        // idList = [1,4,6,8] 一個(gè)id的數(shù)組
    }
}
export default connect(null, {updateTestState})(Test)

// action.js
export const updateTestState = idList => ({type: UPDATE, payload: idList})

簡(jiǎn)單的說(shuō),我就是我在react組件中得到的是一個(gè)關(guān)于id的數(shù)組[1,2,3,4]。我需要做的是將state中的test數(shù)組中找出id等于[1,2,3,4]的,并把他們的show字段變?yōu)?code>false。那么這樣的一步操作應(yīng)該在哪里做???
test.jsx中嘛?這樣我就需要在test.jsx中獲取test這個(gè)state。而且在容器組件中這樣處理數(shù)據(jù)真的好嗎?
reducer.js中嘛?這樣感覺(jué)也不夠純粹?。?/p>

回答
編輯回答
初心

這個(gè)的話,state里面的數(shù)據(jù)一般是通用型的數(shù)據(jù),然后再根據(jù)某個(gè)組件需要的數(shù)據(jù)結(jié)構(gòu)按需映射即可。至于你說(shuō)在哪里做這一步,在mapStateToProps里面去做,這樣能根據(jù)組件的需要進(jìn)行合適的映射,state的數(shù)據(jù)結(jié)構(gòu)最好是設(shè)計(jì)的扁平化一點(diǎn)兒,希望對(duì)你有幫助

2018年3月19日 05:28