wangEditor中获取Toolbar配置的正确时机与方法

在使用wangEditor富文本编辑器时，开发者经常需要获取工具栏(Toolbar)的配置信息进行自定义操作。然而，很多开发者会遇到获取到的toolbar为null的情况，这通常是由于获取时机不当造成的。

问题现象

当开发者尝试在编辑器实例化后立即通过DomEditor.getToolbar(editor)获取工具栏对象时，可能会发现返回值为null。这种情况尤其容易出现在编辑器的created生命周期钩子中。

原因分析

wangEditor的工具栏是在编辑器初始化过程中异步创建的。在编辑器实例刚创建时，工具栏尚未完成初始化，因此此时尝试获取工具栏对象会得到null。编辑器内部维护了一个EDITOR_TO_TOOLBAR映射表，只有当工具栏完全创建后才会将对应关系存入该表。

解决方案

正确的做法是在适当的生命周期中获取工具栏配置：

1. 在onChange回调中获取：这是最可靠的方式，因为此时工具栏肯定已经初始化完成。

2. 避免在created钩子中获取：此时工具栏可能还未准备好。

3. 使用异步方式：如果确实需要在初始化阶段获取，可以考虑使用setTimeout等方式延迟获取。

最佳实践

const editor = createEditor({
  // 其他配置...
  onChange(editor) {
    const toolbar = DomEditor.getToolbar(editor);
    if (toolbar) {
      const config = toolbar.getConfig();
      // 处理配置...
    }
  }
});

总结

理解wangEditor工具栏的初始化时序对于正确操作工具栏配置至关重要。开发者应当避免在过早的生命周期中尝试获取工具栏对象，而应选择在onChange等确保工具栏已就绪的回调中进行相关操作。这一设计模式在富文本编辑器中很常见，理解它有助于更好地使用wangEditor进行二次开发。