wangEditor5 如何给节点添加额外属性

在wangEditor5中，节点（如段落、图片、链接等）的属性默认是由编辑器内部管理和生成的。如果需要给节点添加额外的自定义属性，通常可以通过以下几个步骤实现：

1. **监听节点插入或修改**：你可以注册编辑器提供的事件，例如`editor.ready`, `editor.textChange` 或者`editor.nodeInserted`，当内容发生变化时检查新插入或更新的节点。

editor.on('nodeInserted', (e) => {
  const node = e.target;
  // 在这里添加自定义属性
  node.data.customKey = 'customValue';
});

2. **操作DomNode对象**：编辑器的节点通常是基于DOM的，可以直接操作其`.dom`属性来添加自定义属性。例如：

const domNode = editor.dom.get(node);
domNode.setAttribute('data-custom-attr', 'your-value');

3. **使用插件或自定义指令**：如果你希望保持代码组织，可以考虑编写一个插件或者使用自定义指令来封装这个过程。例如，定义一个方法：

editor.commands.addCommand({
  name: 'setCustomAttr',
  exec: (node, value) => {
    node.data.customKey = value;
    node.dom.setAttribute('data-custom-attr', value);
  },
});

然后在需要的地方调用这个命令：

editor.execCommand('setCustomAttr', 'yourCustomData');

请注意，为了保持兼容性和性能，最好遵循WangEditor5的文档建议，避免过度操作DOM，特别是在大量节点的情况下。