调度员为空

问题描述 投票:0回答:1

调度员为空 我遇到此错误任何人都可以帮助我如何解决它 错误

我尝试了很多方法但无法解决这个问题

调度员为空

当我尝试使用 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 
reactjs react-hooks react-redux dispatcher dispatch
1个回答
0
投票

看起来像是某种冲突...您可以尝试清除canche并重新安装吗?

npm cache clean -f
npm i
© www.soinside.com 2019 - 2024. All rights reserved.