API调用数据库后上下文未更新

问题描述

我在上下文内部使用useReducer，该API对mongoDB进行API调用以更改数据库。

在集合organisation中创建新文档时，我将使用刚创建的新组织发回一个对象。我想要做的是在成功创建新组织后用新组织来更新上下文，以便React重新渲染，用户可以看到最新信息。

我成功创建了一个新的organisation，但是直到我刷新应用程序后它们才会显示。

任何人都可以看到我要去哪里了，以便在制作新的organisation之后可以重新渲染React吗？

后端

app.post('/apI/Organisations',requireLogin,async (req,res) => {
    try {
        const { organisationName,organisationUsers } = req.body
        const parsedUsers = organisationUsers.split(',').filter(el => el.length > 0).map(el => el.replace(/ /g,'')).concat([req.user.email])
        const organisation = await new Organisation({
            organisationName,organisationUsers: parsedUsers,organisatioNowner: req.user.email
        }).save()
        res.send(organisation)
    } catch (err) {
        console.log(err)
        res.status(400)
        res.send({ error: err })
        return
    }
})

前端（上下文）

const initState = []

const organisationsReducer = (state,action) => {
    const updatedState = state.filter(org => org._id !== action.payload._id)
    switch (action.type) {
        case 'CREATE_SUCCESS':
            return [...state,...action.payload]
        case 'CREATE_ERROR':
            console.error(action.payload)
        case 'FETCH_SUCCESS':
            return [...state,...action.payload]
        case 'FETCH_ERROR':
            return [...state]
        case 'UPDATE_SUCCESS':
            return [...updatedState,action.payload]
        case 'UPDATE_ERROR':
            console.error(action.payload)
            return [...state]
        case 'DELETE_SUCCESS':
            return [...updatedState]
        case 'DELETE_ERROR':
            console.error(action.payload)
            return [...state]
        default:
            return state
    }

const createOrganisation = async (formData) => {
        try {
            const req = await axios.post('/apI/Organisations',formData)
            organisationsdispatch({action: 'CREATE_SUCCESS',payload: req.data})
        } catch (err) {
            organisationsdispatch({action: 'CREATE_ERROR',payload: err})
        }
}
const [organisations,organisationsdispatch] = useReducer(organisationsReducer,initState)

return (
    <OrganisationsContext.Provider value={{ organisations,updateOrganisation,editOrganisationUser,createOrganisation,deleteOrganisation }}>
        {children}
    </OrganisationsContext.Provider>
)

解决方法

我发现了这个问题-在分派功能中，我使用动作而不是类型