Invalid hook call. Hooks can only be called inside of the body of a function
Invalid hook call. Hooks can only be called inside of the body of a function
·
相信大家在react中都遇到过这个错误
然后就开始百度发现试了各种方式都无果,这个错误大致的意思是说非法使用了hooks,可以先试一下react官网的这些解决方式如果还是不行那看一下我踩的这个坑。
我是要在react中使用bizcharts
按照官网步骤,首先安装bizcharts
npm i bizcharts -S
然后选择你想要的图表将代码复制粘贴到你要展示的结构中
import { Chart, Interval } from 'bizcharts';
import './App.css';
function App() {
// 数据源
const data = [
{ genre: 'Sports', sold: 275 },
{ genre: 'Strategy', sold: 155 },
{ genre: 'Action', sold: 230 },
{ genre: 'Shooter', sold: 250 },
{ genre: 'Other', sold: 450 }
];
return (
<div className="App">
<Chart height={320} autoFit data={data} >
<Interval position="genre*sold" />
</Chart>
</div>
);
}
export default App;
然后满心欢喜的打开浏览器看看效果,好家伙一片空白,控制台还报错了,报的就是上面那个错,
我就一脸疑问???因为在此之前我还使用过echarts,是没有问题的,然后我就打开echarts试了一下,一样的错.....
然后我就查看了一下目录文件所有的react版本
npm ls react
发现bizcharts引用的react是16版本,而其他都是17版本,那就肯定有问题了,可是为啥呢?
想起来用的是npm去安装的 之前就被npm坑过几次,npm很容易出现依赖包的各种冲突问题,
然后我就卸载了bizcharts
npm uninstall bizcharts
然后使用yarn安装
yarn add bizcharts -S
然后发现一切都好了!
再次查看react版本
npm ls react
版本号确实都统一了
总结:
真的踩了好几次npm的坑,所以尽量少使用npm,可以看看yarn和pnpm.
更多推荐
已为社区贡献1条内容
所有评论(0)