你遇到的错误提示表明在尝试从 ./actions
模块导入 getMoviesList
函数时失败了。这通常是由于以下几种原因之一:
./actions
路径不正确。./actions
模块中没有正确导出 getMoviesList
函数。确保 ./actions
路径是正确的。假设你的项目结构如下:
src/
├── actions/
│ └── index.js
├── components/
│ └── MovieList.js
那么 MovieList.js
中导入 getMoviesList
的语句应该是:
import { getMoviesList } from '../actions';
确保 ./actions
模块中正确导出了 getMoviesList
函数。例如,在 actions/index.js
中:
export const getMoviesList = () => {
// 你的逻辑代码
};
确保导入语句中的函数名拼写正确。例如:
import { getMoviesList } from '../actions';
假设你的 actions/index.js
文件内容如下:
// actions/index.js
export const getMoviesList = () => {
// 模拟获取电影列表的异步操作
return fetch('https://api.example.com/movies')
.then(response => response.json())
.then(data => data.movies);
};
然后在 components/MovieList.js
中导入并使用:
// components/MovieList.js
import React, { useEffect } from 'react';
import { useDispatch, useSelector } from 'react-redux';
import { getMoviesList } from '../actions';
const MovieList = () => {
const dispatch = useDispatch();
const movies = useSelector(state => state.movies);
useEffect(() => {
dispatch(getMoviesList());
}, [dispatch]);
return (
<div>
<h1>Movies List</h1>
<ul>
{movies.map(movie => (
<li key={movie.id}>{movie.title}</li>
))}
</ul>
</div>
);
};
export default MovieList;
如果你仍然遇到问题,请提供更多的代码细节,以便进一步诊断问题。
领取专属 10元无门槛券
手把手带您无忧上云