e[i].render 不是 function fabric js

Question

我正在使用撤消和重做功能，当我 undo/redo 对象的位置（z-index）发生变化时，我没有找到任何方法将 z-index 保存到 JSON (toJSON)。所以我尝试在 undo/redo 函数上设置 z-index。

...
var jsonData = JSON.parse(config.canvasState[config.currentStateIndex+1]);
if(jsonData.objects.length){
       jsonData.objects.forEach(function(e){
              if(e && e.selectable === false){
                     canvas.sendToBack(e);
              }
       })
}
canvas.renderAll();
...

我收到错误 e[i].render is not a function。

解决方案

var jsonData = JSON.parse(config.canvasState[config.currentStateIndex+1]);
var imgObjs = _canvas.getObjects();
if(imgObjs.length){
       imgObjs.forEach(function(e){
              if(e && e.selectable === false){
                     _canvas.sendToBack(e);
              }
       });
}

Answer 1

运行 JSON.parse(config.canvasState[config.currentStateIndex+1]); 创建 canvas 中所有元素实例的副本。当您在这些副本上运行 .forEach 并尝试使用 fabric 渲染它们时，您正在对 在 canvas[=20= 中不存在的元素进行操作] 因此不能对它们调用 sendToBack。

我建议查看是否有其他方法获取 canvas 上的元素列表。 canvas._objects.forEach(...) 之类的东西可能会起作用。

Answer 2

我在 Fabric 3.6 中遇到了这种情况

问题是添加到 fabric 的对象之一是 HTML 元素而不是“fabric 对象”。修复引用清除了 Fabric 期望 .render() 在正确类型的对象时存在的问题。

e[i].render 不是 function fabric js

e[i].render is not a function fabric js

javascript

fabricjs