ReactJS中的FabricJS错误

Question

嘿，我有一个使用FabricJS的react项目。在大约2-3周的时间里，我收到以下错误："FabricCan.js:31未捕获TypeError：_fabric2.default.Canvas不是一个构造函数“

但是几周前，下面的代码运行得很好。

import React from 'react';
import fabric from 'fabric';

..。

render: function(){
   var can = new fabric.Canvas("test");

   return(
     <canvas id="test"> </canvas>
   );
}

Answer 1

您应该将创建fabric canvas的调用移出render函数。该元素在页面上尚不存在。Instead you should do it on the componentDidMount call like in this jsfiddle。

Answer 2

我不知道为什么，但以下方法对我有效：

1. npm卸载fabric --保存
2. npm install react--webpack

然后导入以下内容：

“从‘fabric-webpack’导入{fabric}；

Answer 3

我也有同样的问题。

使用

import 'fabric';

而不是

import fabric from 'fabric';

它允许全局定义fabric变量。

或者您可以使用

import { fabric } from 'fabric';