鹅毛笔中图像标签的数据属性

Question

我想向图像标签（例如data-filename =“ abc.jpeg”）添加自定义数据属性，该标签可以在Quill编辑器中存储某些元数据。我曾在Quill中尝试过归因者，但未能成功完成工作。

任何人都可以帮忙。

Answer 1

解决了问题。我通过扩展羽毛笔图像格式创建了一个新的污点。

const ImageBlot = Quill.import('formats/image');
export class CustomImageBlot extends ImageBlot {

  static blotName = 'customImage';
  static tagName = 'img';

  /**
   * Converts the HTML tag to image blot
   * @param value 
   */
  static create(value) {

    let node = super.create();

    node.setAttribute('src', value.url);
    node.setAttribute('data-attr', value.data);

    return node;
  }

  /**
   * Converts the image blot to HTML tag
   * @param node 
   */
  static value(node) {

    var blot = {};

    blot.url = node.getAttribute('url');
    blot.data_attr = node.getAttribute('data-attr');

    return blot;
  }
}

非常感谢suggestion进行编辑。使用图像格式的默认支持，我能够解决一些问题。