【发布时间】: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