Javascript 从fetch（）在redux中设置状态

我是新来的。这是设置状态的正确方法吗

从服务器获取数据后，如何为您设置状态

这是我的密码：

const initialState={
    forYou: [],
}


function rootReducer(state=initialState, action){
    switch (action.type){
        case 'forYou':
            var url = 'http://127.0.0.1:8000/forYou/'
            fetch(url, {
                method: 'GET',
                headers:{
                    'Content-Type': 'application/json',
                }
            }).then(res=>res.json().then(result=>{
                var forYou = result
                return{
                    ...state,
                    forYou: forYou
                }
            }))
        
        break


        default:
            return state;
    }
}

export default rootReducer

---

那么，我应该改变什么呢？

您的减速器必须同步返回新状态，而您没有这样做

then

中的返回值不是reducer函数的返回值，而是

then

函数的返回值，这是

fetch

调用链最终要解决的问题

返回已解析的值（例如，

返回fetch（…）

）也不起作用，因为fetch是异步的。它的返回值是a，而不是解析状态

有现成的库，如和，可以帮助实现这类功能，但基本思想是一样的：将异步代码移到单独的函数中，并让它分派状态转换：

//伪代码，不是实际实现
用于您的异步函数（）{
//转换到加载状态；显示微调器或其他
分派（{type:LOADING，value:true}）；
//等待取回
常量结果=等待获取（…）；
//提取完成后，发送一个包含结果的操作
分派（{type:FOR_YOU，value:result}）
//并从加载状态过渡
分派（{type:LOADING，value:false}）
}

减速器必须同步返回新状态，而您没有执行此操作

then

中的返回值不是reducer函数的返回值，而是

then

函数的返回值，这是

fetch

调用链最终要解决的问题

返回已解析的值（例如，

返回fetch（…）

）也不起作用，因为fetch是异步的。它的返回值是a，而不是解析状态

有现成的库，如和，可以帮助实现这类功能，但基本思想是一样的：将异步代码移到单独的函数中，并让它分派状态转换：

//伪代码，不是实际实现
用于您的异步函数（）{
//转换到加载状态；显示微调器或其他
分派（{type:LOADING，value:true}）；
//等待取回
常量结果=等待获取（…）；
//提取完成后，发送一个包含结果的操作
分派（{type:FOR_YOU，value:result}）
//并从加载状态过渡
分派（{type:LOADING，value:false}）
}

No，在

fetch

回调运行之前，您的

案例完成，并且
rootReducer
返回
undefined
。请看，这是哪一个重复。将所有获取调用移动到诸如redux saga或redux thunk等中间件是更好的做法。。从那里，您可以通过回调函数传递响应的详细信息，然后分派一个操作来设置状态。不，您的
for you
案例完成，并且
rootReducer
在
获取
回调运行之前返回
未定义的
。请看，这是哪一个重复。将所有获取调用移动到诸如redux saga或redux thunk等中间件是更好的做法。。从这里，您可以通过回调函数传递响应的详细信息，然后分派一个操作来设置状态。