在“Jodit”wyswig 编辑器代码编辑器模式下未触发“onBlur”，“useCallback”无法正常工作

Question

我用我的案例制作了一个 codesandbox 示例，需要帮助才能使其正常工作。 这是示例的 link。

重现步骤：

1. 在 jodit 编辑器上输入内容
2. 鼠标点击编辑器外部，您将看到显示 onBlur 被触发的日志。
3. 使用左上角的 </> 图标切换到代码编辑模式。
4. 修改html上的内容。
5. 鼠标点击编辑器外部，您将不会看到任何额外的日志。

我最初的目标是确认此机制是设计使然还是错误，我试图询问 在 github 存储库上打开票证之前的社区。

您可能还注意到，在我的示例中，日志系统无法正常工作。

我试图堆叠所有日志 - onChange、onBlur 但它只显示最后一个日志。当我点击 Add 按钮时它工作正常。可能react hook的使用有问题

有人可以帮我解决上述问题吗？

1. onBlur 不会在 Jodit 编辑器的代码编辑模式下触发。是设计使然还是错误？
2. 为什么我只看到最新的日志而不是堆积的日志？

提前致谢。

Answer 1

1. onBlur 未被调用，因为在 jodit 中使用单独的 textarea 来显示代码，这可能是 jodit-react 或 [=12 中的错误=]本身
2. 内部 jodit-react textarea 的回调被添加到 useEffect 内部，只有当 config 改变时才会被调用。
   为了正确显示日志，您需要修复将日志保存到状态的方式

const appendLog = useCallback(
  (message) => {
    setLogs(oldLogs => [...oldLogs, message]);
  },
  []
);