将 JSON 加载到画布后无法获取对象 - Fabric JS答案

【问题标题】：Having trouble with getting Objects after loading JSON to canvas - Fabric JS将 JSON 加载到画布后无法获取对象 - Fabric JS
【发布时间】：2016-07-31 06:00:20
【问题描述】：

我正在使用Fabric.JS 构建模板工具。我已经能够成功地将画布序列化为DatalessJSON，然后将DatalessJSON 反序列化回画布上。但是，一旦加载了JSON，我在尝试使用这些对象时遇到了问题。

 function loadTemplate() {


 var template = $('#JSONserial').val();
 canvas.clear();
 canvas.loadFromDatalessJSON(template);
 canvas.renderAll();

 var allObjects = canvas.getObjects();

 console.log(allObjects);

所以到这里，画布肯定加载成功了JSON，所有的对象看起来都没有问题。但是，当我尝试 getObjects 函数时，console.log 语句返回 "[]"

我已经使用'name' 属性扩展了toObjects 函数，以便我可以识别每个JSON 加载的对象，但我什至无法做到这一点，因为我根本无法拉动对象.

有什么想法吗？

【问题讨论】：

我想我明白了。因此，加载它们无法调用的对象后似乎只有一点时间。我将“getObjects()”函数放在超时函数中，超时时间为 100，它现在似乎可以工作了。
那是错误的方式。检查答案

标签： javascript jquery html canvas fabricjs

【解决方案1】：

loadFromDatalessJson 是异步的。

loadFromDatalessJSON(json, callback, reviver)

使用回调在对象加载结束时运行代码。

 function loadTemplate() {
 var template = $('#JSONserial').val();
 canvas.clear();
 var allObjects = [];
 canvas.loadFromDatalessJSON(template, function(){
   allObjects = canvas.getObjects();
   console.log(allObjects);
   canvas.renderAll();
 });

}

【讨论】：