0

如何为Blockquilljs 中的每个元素添加属性？

我知道我可以扩展 a Block，但是即使在键盘上按“Enter”也可以添加属性吗？

let Block = Quill.import('blots/block');

class ParaBlot extends Block {
   static create(value) {
      let node = super.create();
      return node;
   }
}
4

1 回答 1

1

要为每个 Block 元素添加样式或类等属性，

我们可以从羊皮纸库中扩展默认的块印迹元素，

就像您已经在做的那样，我们导入Block Blot元素并扩展方法以使用该函数create(...)编辑节点的属性。setAttribute

例如，在这里我将添加一个边框和一个 customBlock 类。

最后我们用我们的覆盖默认的 BlockBlot

const BlockBlot = Quill.import('blots/block');

class CustomBlockBlot extends BlockBlot {
    static create(value) {
        const node = super.create(value);
        node.setAttribute('style', 'border: 1px solid lightgrey');
        node.setAttribute('class', 'customBlock');
        return node;
    }
}
Quill.register('formats/block', CustomBlockBlot);

这是一个演示https://codepen.io

此代码块必须在创建目标 Quill 实例之前运行new Quill(...)

我们还应该考虑它不能动态更改格式，尽管我相信我们可以备份Delta并使用这些新的默认值创建一个全新的 Quill 实例。

另一个关于此实现自定义编辑器的好帖子 quill-blot

于 2020-05-15T12:55:20.280 回答