【问题标题】:Redux thunk - async action scope changesRedux thunk - 异步操作范围更改
【发布时间】:2019-12-17 12:20:44
【问题描述】:

技术:反应、打字稿


问题

我正在尝试在 redux 中编写一个从服务器获取数据的异步操作创建器,但是我返回的内部函数的范围发生了变化并且什么都不知道


代码

动作/Movie.ts

import MovieServer from '../../server/Movie';
import { setMovies } from './movieActions';

const fetchMovies = () => {
    console.log(MovieServer);
    return async (dispatch: any) => {
        console.log(MovieServer);
        const movies: Movie[] = await MovieServer.fetchMovies();

        dispatch(setMovies(movies));
    }
}

服务器/Movie.ts

import Movie from "../models/movie";
import { serverURL } from "./config";

const fetchMovies = async (): Promise<Movie[]> => {
    let movies: Movie[] = [];

    try {
        const response = await fetch(serverURL + "/api/movie", {
            method: "GET"
        });


        if (!response.ok || response.status !== 200) {
            throw new Error("bad response");
        } else {
            movies = await response.json();
        }
    } catch (err) {}

    return movies;
} 

export default { fetchMovies };

当我运行代码时,第一个日志输出是MovieServer的函数声明,第二个日志输出是undefined

所以在内部函数内部有些东西不好并且会抛出错误。


我试过的

我尝试将内部函数包装在 .bind(this) 中,但它会引发 ts 编译错误:The containing arrow function captures the global value of 'this'.

【问题讨论】:

  • 上面的代码没有问题。也许还有一些您没有复制/粘贴的代码,或者是这样吗?另一件可能有帮助的事情是发布../../server/Movie.js 模块的一些代码
  • 看起来不错——这是一个标准的闭包。还有其他事情在起作用。
  • 问题不存在。代码是正确的。第二个console.log() 返回undefined??

标签: reactjs typescript redux redux-thunk


【解决方案1】:

感谢您的回答,但这是服务器的问题,我不知道为什么它会影响功能范围但我解决了它

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2018-01-31
    • 2017-03-03
    • 2021-10-04
    • 2020-01-17
    • 2016-12-20
    • 2016-10-24
    • 2016-09-19
    • 2018-03-20
    相关资源
    最近更新 更多