React-redux 不会在状态改变时重新渲染

时间:2021-08-01 11:41:44

标签: javascript reactjs redux react-redux

我刚开始使用 redux 和 react-redux。我观察到一种非常奇怪的行为,无法理解它。

我正在尝试这样的事情。

const fetchedFolders = useSelector(state=>{
        console.log("redux state = ",state);
        return state.fetchedFolders;
    });

const updateFetchedFolders = useDispatch();

我有回调函数,它接收一组新的值并将更新存储中的状态。

let appendFoldersToList=(newFolders)=>{
        console.log(typeof(newFolders))
        if(typeof(newFolders) === undefined)
            console.log("go to error");
        
        else{
            updateFetchedFolders(setFetchedFolders([...fetchedFolders,...newFolders]));
        }
    }

这完美地工作并用新值重新渲染列表 但如果我更换线

updateFetchedFolders(setFetchedFolders([...fetchedFolders,...newFolders]));

updateFetchedFolders(setFetchedFolders([...newFolders]));

它不会重新渲染并且仍然显示旧列表。但是在控制台中,我可以看到数据已更新。

我不明白为什么它会在第一种情况下重新渲染,而在第二种情况下不会。

这就是我的减速器的样子:-

export const reducer = (state=initialState, action)=>{

    switch(action.type){
        case 'SET_FOLDERS': return {
            ...state,
            fetchedFolders:[...action.payload]
        }
    }
}

这是我的动作创建者:-

export const setFetchedFolders = (payload)=>{
    return {
        type:'SET_FOLDERS',
        payload:payload
    }
}

这是我的初始状态:-

const initialState = {
    fetchedFolders:[],
    
}

我不认为我没有改变状态。

我的数组看起来像这样::-

[
   {name:cats, id:SOME_ID},
   {name:dogs, id:SOME_ID}
]

0 个答案:

没有答案