面料：從JSON加載子類對象時出錯

In this jsfiddle我有一條從子類創建的線（它基本上是一條具有兩個附加屬性的線）。我試圖序列化/反序列化到/從JSON線。我可以序列化沒有問題（包括兩個額外的屬性），但是當我嘗試使用loadFromJSON反序列化時，我得到了Cannot read property 'async' of undefined異常。面料：從JSON加載子類對象時出錯

取消註釋jsfiddle中的最後一行以獲取錯誤。

我實現了fromObject()方法，但我不確定它是否正確。這段代碼有什麼問題？

的Javascript：

var canvas = new fabric.Canvas('c'); 

fabric.PolySegment = fabric.util.createClass(fabric.Line, { 

    type: 'seg', 

    initialize: function(points,options) { 
    options || (options = { }); 

    this.callSuper('initialize', points,options); 
    this.set('poly', options.poly); 
    this.set('id', options.id); 
    }, 

    toObject: function() { 
    return fabric.util.object.extend(this.callSuper('toObject'), { 
     poly: this.get('poly'), 
     id: this.get('id') 
    }); 
    }, 

    _render: function(ctx) { 
    this.callSuper('_render', ctx); 
     } 
    }); 

fabric.PolySegment.fromObject = function (object, callback) { 
    return new fabric.PolySegment(object); 
}; 

fabric.PolySegment.async = true; 

var coords1 = [ 10, 10, 100, 100 ]; 
var seg1 = new fabric.PolySegment(coords1, { 
    stroke: 'black', 
    strokeWidth: 6, 
    originX: 'left', 
    originY: 'top', 
    poly: 111111, 
    id: 222222 
}); 

canvas.add(seg1); 
var json = JSON.stringify(canvas); 
document.getElementById('t').innerHTML = json; 

// uncomment the line below, you'll get an exception 
//canvas.loadFromJSON(json);

來源

2015-04-03 ps0604

在看你的小提琴，好像這個問題是你給你的新類的類型值。如果我改變：

type: 'seg',

到

type: 'polySegment',

，並取消對最後一行，我沒有得到這個錯誤。但是，我也沒有在畫布上加載該行。但我想我並不是100％確定腳本中發生了什麼 - 您正在加載polySegment，然後將其轉換爲JSON並重新加載它？我假設這僅僅是爲了說明的目的。

雖然我在這裏建議擺脫你的錯誤，但我個人不能100％確定它爲什麼有效。在閱讀FabricJS documentation on Subclassing時，它沒有指定子類的類型需要與子類的定義匹配，但它似乎工作...

我希望能以某種方式提供幫助。

對此的最後一條評論，我一直使用toJSON方法將canvas元素傳遞給JSON。儘管這會檢索一個JSON對象，而不是像你這樣的字符串。此外，toJSON方法要求您指定要捕獲的屬性，因此對於您的情況，這可能不是最好的方法。 It's discussed on this page。但是我想提出這個問題，我確實知道toJSON方法在loadFromJSON方法中效果很好。所以我提到，如果您發現JSON.stringify方法成爲問題，則有另一種方法可以實現相同的概念。

來源

2015-04-05 14:13:34 PromInc

你說得對，如果我將類型重命名爲'polySegment'我沒有得到錯誤，但是行也不會呈現，[見這個jsfiddle]（http://jsfiddle.net/Pgschr/yvcog2te/18 /）。在這個例子中，我從畫布轉換爲JSON並返回。 JSON反序列化後，畫布應顯示原始行。此外，這兩個附加屬性應該在對象中（這也不起作用） – ps0604 2015-04-05 15:45:07

問題出在'fromObject'方法中。我試過[這jsfiddle]（http://jsfiddle.net/Pgschr/yvcog2te/20/）並且不起作用。 – ps0604 2015-04-05 16:03:30

面料：從JSON加載子類對象時出錯

回答

相關問題