调度员为空 我遇到此错误任何人都可以帮助我如何解决它 错误
我尝试了很多方法但无法解决这个问题
调度员为空
当我尝试使用 useDispatch 挂钩时,我似乎收到一条错误消息“调度程序为空”。我怀疑问题出在这个组件上。请参阅屏幕截图以获取详细的错误信息。
import React, { useEffect, useState } from 'react'
import { Button } from 'antd';
import './Product.css'
import { useDispatch } from 'react-redux';
import { add } from '../Store/Slices/cartSlice';
function Product() {
const \[products, setProducts\] = useState(\[\]);
useEffect(() =\> {
const fetchApi = async () =\> {
const dataApi = await fetch('https://fakestoreapi.com/products');
const data = await dataApi.json();
setProducts(data);
}
fetchApi();
},\[\]);
const dispatch = useDispatch();
function handleAdd(product){
dispatch(add(product));
}
return (
\<div className='productWrapper'\>
{
products.map((product) =\> (
\<div className='card' key ={product.id}\>
\<img src={product.image} style={{width:"80px"}}/\>
<h4>{product.title}</h4>
<h5>{product.price}</h5>
\<Button type="primary" onClick={handleAdd(product)}\>Add to Cart\</Button\>
\</div\>
))
}
</div>
)
}
export default Product
这是我的包 JSON 文件
{
"name": "my-app",
"version": "0.1.0",
"private": true,
"dependencies": {
"@ant-design/icons": "^5.3.1",
"@testing-library/jest-dom": "^5.17.0",
"@testing-library/react": "^13.4.0",
"@testing-library/user-event": "^13.5.0",
"@types/react-router-dom": "^5.3.3",
"antd": "^5.15.0",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-router": "^6.22.2",
"react-router-dom": "^6.22.2",
"react-scripts": "5.0.1",
"web-vitals": "^2.1.4"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": [
"react-app",
"react-app/jest"
]
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
}
}
# can anyone Help Me post Your Query i Will Answer You
看起来像是某种冲突...您可以尝试清除canche并重新安装吗?
npm cache clean -f
npm i