在Typescript中子类化Fabric JS类型反序列化时导致错误

时间:2019-06-07 11:35:22

标签: javascript typescript fabricjs

我扩展了Fabric Js默认类型:


export class Button extends fabric.Rect {


  public text: string;
  public textColor: string;
  public font = '30px Arial';
  public action: ActionEnum;
  public type = 'button';


  constructor(options: IButttonOptions) {
    super(options);
    if (options.font) {
      this.font = options.font;
    }
    this.text = options.text;
    this.textColor = options.textColor;
    this.action = options.action;
  }


  toDatalessObject(propertiesToInclude?: string[]): any {
    propertiesToInclude = (propertiesToInclude || []).concat(
      ['text', 'textColor', 'font', 'action']
    );

    return super.toDatalessObject(propertiesToInclude);
  }


  _render(ctx: CanvasRenderingContext2D) {
    super._render(ctx);
    console.log('test');
    ctx.font = this.font;
    ctx.fillStyle = this.textColor;
    ctx.textAlign = 'center';
    ctx.fillText(this.text, 0, 10);
  }

我想像这样对画布进行序列化/反序列化:

var json = canvas.toDatalessJSON();
canvas.clear();
canvas.loadFromJSON(json); // cause error 

但是当我想用上面定义的对象加载画布时,出现异常“ klass未定义”

我不知道如何解决此问题。有人可以提供帮助吗?

0 个答案:

没有答案