qq_45960446 2022-10-17 13:43 采纳率: 100%
浏览 97
已结题

急!react + ant design 错误求解!

问题遇到的现象和发生背景

我用react + ant design做前端。在使用ant design组件时一直遇到如下问题:
react.development.js:1476 Uncaught Error: Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for one of the following reasons:

  1. You might have mismatching versions of React and the renderer (such as React DOM)
  2. You might be breaking the Rules of Hooks
  3. You might have more than one copy of React in the same app
用代码块功能插入代码,请勿粘贴截图
import { Component } from 'react';
/* import { Button } from "antd"; */
import { Table } from 'antd';
import "antd/dist/antd.min.css";
class GoodsList extends Component{
    state = {}; //存储状态
    componentDidMount() {
        const dataSource = [
            {
              key: '1',
              name: '胡彦斌',
              age: 32,
              address: '西湖区湖底公园1号',
            },
            {
              key: '2',
              name: '胡彦祖',
              age: 42,
              address: '西湖区湖底公园1号',
            },
          ];
          this.setState({dataSource})
    }
    render() {
        const columns = [
            {
              title: '姓名',
              dataIndex: 'name',
              key: 'name',
            },
            {
              title: '年龄',
              dataIndex: 'age',
              key: 'age',
            },
            {
              title: '住址',
              dataIndex: 'address',
              key: 'address',
            },
          ];
        return <Table dataSource={this.state.dataSource} columns={columns} />;
    }
}
export default GoodsList;


import GoodsList from "./views/GoodsList";
function App() {
  return (
    <div>
      <GoodsList></GoodsList>
    </div>
  );
}
 
export default App;

import React from 'react'
import ReactDOM from 'react-dom'
import App from "./App"

ReactDOM.render(<App />, document.getElementById("root"))
运行结果及报错内容

img

img

我的解答思路和尝试过的方法

我用的教程是react17 然后我下载的是18,但已经降成了17。 根据教程来编写会出现此类错误。根据ant design官方文档来编写也还是出现此类错误。 网上查了各种方法,但都不管用。

我想要达到的结果

不出现截图中的错误

  • 写回答

5条回答 默认 最新

  • Jackyin0720 2022-10-17 14:23
    关注

    你参照这个实际案例,看看是否对你有所帮助:https://blog.csdn.net/qq_45327886/article/details/109129999
    我看了下,和你的报错类似,解决方法看是否对你有所启发

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(4条)

报告相同问题?

问题事件

  • 系统已结题 10月25日
  • 已采纳回答 10月17日
  • 创建了问题 10月17日

悬赏问题

  • ¥15 请问这个是什么意思?
  • ¥15 STM32驱动继电器
  • ¥15 Windows server update services
  • ¥15 关于#c语言#的问题:我现在在做一个墨水屏设计,2.9英寸的小屏怎么换4.2英寸大屏
  • ¥15 模糊pid与pid仿真结果几乎一样
  • ¥15 java的GUI的运用
  • ¥15 我想付费需要AKM公司DSP开发资料及相关开发。
  • ¥15 怎么配置广告联盟瀑布流
  • ¥15 Rstudio 保存代码闪退
  • ¥20 win系统的PYQT程序生成的数据如何放入云服务器阿里云window版?