React redux,动作有效负载在 try/catch 块中看不到变量

React redux, action payload cannot see variable within a try/catch block

我试图将变量 "result" 放入操作负载中,但无法定义它,因为它在 try 块中。我不确定如何解决这个问题。我还是 Redux 的新手,这是操作本身。

export const fetchMovies = async (endpoint, category) => {
    const isLoadMore = endpoint.search('page');
    try{
        const result = await (await fetch(endpoint)).json();
    } catch(error){
        this.setState({error: true});
        console.log(error);
    }

    return{
        type: HomeActionTypes.FETCH_MOVIES,
        payload: result, category, isLoadMore
    }
}

我已经尝试使用 let 在顶部初始化结果,但它没有解决问题。另外,我不确定我是否使用我在其中设置的变量正确设置了负载。例如,它们需要在 reducer 中使用,我的猜测是在我需要在 reducer 中使用它们的任何地方将有效负载中的项目称为 action.payload.result、action.payload.category、action.payload.isLoadMore .这是正确的方法吗?感谢您为帮助回答我的问题所做的贡献。

您可以采取不同的方法。第一个,你正在尝试的那个,你必须在相应的词法范围内将变量 result 声明为 let(这样你就可以修改它的值),所以在这种情况下 try 括号和函数声明内部,以便 return 可以访问它的值。

export const fetchMovies = async (endpoint, category) => {
    const isLoadMore = endpoint.search('page');
    let result = null
    try{
        result = await (await fetch(endpoint)).json();
    } catch(error){
        this.setState({error: true});
        console.log(error);
    }

    return{
        type: HomeActionTypes.FETCH_MOVIES,
        payload: result, category, isLoadMore
    }
}

我宁愿遵循的另一种方法是将快乐流程的所有逻辑移动到 try 大括号中,并管理 catch 中错误流程中返回的操作大括号:

export const fetchMovies = async (endpoint, category) => {
    try{
        const isLoadMore = endpoint.search('page');
        const result = await (await fetch(endpoint)).json();
        return{
          type: HomeActionTypes.FETCH_MOVIES,
          payload: result, category, isLoadMore
        }
    } catch(error){
        // Rather than modifying the state, use a defined error action to trigger the proper error flow and logic.
        console.log(error);
        return{
          type: HomeActionTypes.FETCH_MOVIES_ERROR, // To be defined in the way you desire to be able to manage it as the execution of this action
          payload: error
        }
    }
}