使用 useEffect 中的 useDispatch 获取数据（代码有效但有错误）

Question

我尝试使用 useEffect 通过 useDispatch 挂钩从 API 获取数据：

  const dispatch = useDispatch();

  useEffect(() => {dispatch(actions.fetchSearch(submitValue))}, [submitValue, dispatch]);

其中 submitValue - 它是搜索查询的输入值。 fetchSearch() 看起来像这样：

export const fetchSearch = (query) => {
return dispatch => {
    const queryParams = 'http://190.75.199.65/api/products?count=20&sort_by=numberOfEntries&sort_order=DESC&page=1&search='+query;
    axios.get(queryParams)
    .then( res=> {
            dispatch(fetchSearchSuccess(res.data));
        }
    )
};

};

我可以通过这段代码获取数据，但是一直出错：

An effect function must not return anything besides a function, which is used for clean-up.

It looks like you wrote useEffect(async () => ...) or returned a Promise. Instead, write the async function inside your effect and call it immediately

我尝试在 useEffect 中创建异步函数，但错误还是一样，或者我做错了什么。

Answer 1

尝试这样做：

const dispatch = useDispatch();

useEffect(() => {
    (async () => {
     await dispatch(actions.fetchSearch(submitValue));
    })();
}, [submitValue, dispatch]);

我认为这是因为你直接调用了一个异步函数，它在 useEffect 中返回了一个 promise。

Answer 2

代码无需任何更改即可工作

const dispatch = useDispatch();

useEffect(() => {dispatch(actions.fetchSearch(submitValue))}, [submitValue, dispatch]);

只是忘记删除旧的 useEffect。

使用 useEffect 中的 useDispatch 获取数据（代码有效但有错误）

Data fetching with useDispatch inside useEffect (code work but with error)

reactjs

react-redux

use-effect