如何在 fabric.Image() 中添加自定义内容答案

【问题标题】：How to add custom content in fabric.Image()如何在 fabric.Image() 中添加自定义内容
【发布时间】：2016-08-26 12:10:38
【问题描述】：

我正在尝试使用以下建议的方式将画布存储在服务器中：

Fabric.js - how to save canvas on server with custom attributes

但在我的情况下，我正在从如下网址加载图像：

fabric.Image.fromURL(url, function(image) {
   image.alt = product.skuId;
   image.productClass = product.productClass;
   canvas.add(image);
 }, {
   crossOrigin: "Annoymous"
});

但是当我尝试在数据库中存储相同的内容时，不会存储更新的属性。

有没有办法在数据库中存储自定义属性（甚至“alt”）？

编辑：

用我试过的东西创造了一个小提琴： https://jsfiddle.net/anjhawar/dpyb7cf7/

当我们按下保存时，画布被转储到本地存储中，但是当我们检查“objects”数组时，我们没有得到自定义属性，即“id”和“alt”，如示例所示。

我错过了什么吗？

【问题讨论】：

标签： fabricjs

【解决方案1】：

这是我存储自定义属性 (id) 的解决方案。

fabric.Image.fromURL(link, function(img) {
    img.set({
        id : 'image_'+index,
        width : canvas.width / 2,
        height : canvas.height / 2
    });
    canvas.add(img).renderAll().setActiveObject(img);
});

为了快速查看，这里有一个工作代码：http://jsfiddle.net/mullainathan/dpyb7cf7/1

【讨论】：

你能把它存储为对象或 json 并使用 loadfromjson() 重新加载吗？
好的。我根据您的建议编辑了我的问题，但是在保存画布时我仍然没有获得自定义属性。我会让我的保存函数指向我实际应用程序中的“休息”调用。如果你发现一些明显的遗漏，请告诉我。谢谢！
嗨 anjhawar，在这里我提到了更新代码。 jsfiddle.net/mullainathan/dpyb7cf7/1
感谢您的链接，能否请您告知我的代码中缺少的内容。我看到 2 个区别：您使用的不是 localStorage 而是本地对象，并且您使用的是“canvas.toDatalessJSON(['id', 'alt'])”。你认为有什么我错过了观察吗？我提到的这些更改是否会使其发挥作用？
抱歉，我对您的代码一无所知。但是，我建议“canvas.toDatalessJSON”是保存具有自定义属性的本地对象的更好功能。