e[i].render 不是功能结构 js

Question

我正在使用撤消和重做功能，当我撤消/重做对象的位置（z-index）更改时，我没有找到将 z-index 保存到 JSON( toJSON) 的任何方法。所以我尝试在撤消/重做功能上设置 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

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

Answer 2

运行JSON.parse(config.canvasState[config.currentStateIndex+1]);会创建画布中所有元素实例的副本。当您.forEach在这些副本上运行并尝试使用结构渲染它们时，您正在操作画布中不存在的元素，因此无法调用sendToBack它们。我建议看看是否有另一种方法来获取画布上的元素列表。类似的东西canvas._objects.forEach(...)可能会起作用。