笔管中图片标签的数据属性

阿斯温·拉杰夫(Aswin Rajeev)

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

任何人都可以帮忙。

阿斯温·拉杰夫(Aswin Rajeev)

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

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;
  }
}

非常感谢Loa提出的编辑建议使用图像格式的默认支持,我能够解决一些问题。

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

表单标签中的数据属性

来自分类Dev

删除笔管中的内联格式

来自分类Dev

反应:访问<option>标签中的数据属性

来自分类Dev

Rails中的组合数据标签属性

来自分类Dev

从 Instagram 标签中获取数据属性

来自分类Dev

图片标签中的ID失败

来自分类Dev

在笔管编辑器中显示文字

来自分类Dev

媒体选择器在图片html5标签的sizes属性中不起作用

来自分类Dev

如何在JavaScript中获取选项标签的数据属性

来自分类Dev

在html标签中添加html数据属性的标准方法?

来自分类Dev

在ContentEditable更改事件的P标签中插入数据属性

来自分类Dev

输入标签值属性未显示双引号中的数据

来自分类Dev

从 <img 标签上的自定义属性中获取数据

来自分类Dev

图片未显示在img标签中

来自分类Dev

图片未显示在img标签中

来自分类Dev

使用标签选择图库中的图片组

来自分类Dev

如何通过jQuery将跨度标签中的文本添加到数据属性中?

来自分类Dev

在新标签页中打开图片而不下载图片(仅显示图片)

来自分类Dev

Script标签中的djConfig属性

来自分类Dev

img标签中的渐变属性

来自分类Dev

如何在BeautifulSoup4中的html标签中找到特定的数据属性?

来自分类Dev

jQuery父级或父级在表th标签中获取数据属性

来自分类Dev

在jQuery中过滤div并基于自定义数据属性标签将其隐藏

来自分类Dev

如何在Perl中顺序打印XML Tag的属性数据和标签值?

来自分类Dev

剔除数据绑定标签中的多个设置(属性和样式)

来自分类Dev

将图像标签数组存储在html数据属性中,并在单击时检索它们

来自分类Dev

如何在Perl中顺序打印XML Tag的属性数据和标签值?

来自分类Dev

如何通过Apache POI设置Excel Sunburst图表中各个数据标签的文本属性?

来自分类Dev

在父标签的属性中测试嵌套标签的属性

Related 相关文章

  1. 1

    表单标签中的数据属性

  2. 2

    删除笔管中的内联格式

  3. 3

    反应:访问<option>标签中的数据属性

  4. 4

    Rails中的组合数据标签属性

  5. 5

    从 Instagram 标签中获取数据属性

  6. 6

    图片标签中的ID失败

  7. 7

    在笔管编辑器中显示文字

  8. 8

    媒体选择器在图片html5标签的sizes属性中不起作用

  9. 9

    如何在JavaScript中获取选项标签的数据属性

  10. 10

    在html标签中添加html数据属性的标准方法?

  11. 11

    在ContentEditable更改事件的P标签中插入数据属性

  12. 12

    输入标签值属性未显示双引号中的数据

  13. 13

    从 <img 标签上的自定义属性中获取数据

  14. 14

    图片未显示在img标签中

  15. 15

    图片未显示在img标签中

  16. 16

    使用标签选择图库中的图片组

  17. 17

    如何通过jQuery将跨度标签中的文本添加到数据属性中?

  18. 18

    在新标签页中打开图片而不下载图片(仅显示图片)

  19. 19

    Script标签中的djConfig属性

  20. 20

    img标签中的渐变属性

  21. 21

    如何在BeautifulSoup4中的html标签中找到特定的数据属性?

  22. 22

    jQuery父级或父级在表th标签中获取数据属性

  23. 23

    在jQuery中过滤div并基于自定义数据属性标签将其隐藏

  24. 24

    如何在Perl中顺序打印XML Tag的属性数据和标签值?

  25. 25

    剔除数据绑定标签中的多个设置(属性和样式)

  26. 26

    将图像标签数组存储在html数据属性中,并在单击时检索它们

  27. 27

    如何在Perl中顺序打印XML Tag的属性数据和标签值?

  28. 28

    如何通过Apache POI设置Excel Sunburst图表中各个数据标签的文本属性?

  29. 29

    在父标签的属性中测试嵌套标签的属性

热门标签

归档