1

我尝试使用收到的道具更新我的 CodeMirror 组件（从 react-codemirror 导入）的值，但即使道具发生了变化，该值也不会改变。而且因为我使用 corsanywhere 从 API 加载以克服 CORS 限制，所以有时获取请求会失败。但是，当 fetch 成功时，该值仍然没有更新。

这是我尝试的屏幕截图： 试图

function CodeConsole(props) {
  console.log("CodeConsole props: ", props);
  const options = {
    readOnly: true
  };
  const stdout = props.output.stdout;
  console.log("stdout: " + stdout);
  return <Codemirror value={stdout} options={options} autoFocus={false} />;
}

这是我在输入中键入“hello world”时两个日志语句的控制台输出，证明道具已更新：

CodeConsole props:  {output: {stdout: "hello world↵", stderr: "", error: ""}}
stdout: we

请参阅下面的答案以获取解决方案

4

1 回答 1

1

我通过用常规的 textarea 替换 CodeMirror 组件解决了这个问题，它相应地更新了它的值。但是，我仍然希望有人解释 CodeMirror 值更新问题背后的原因。我正在为我的代码编辑器和控制台寻找一致的外观和风格，因此将 CodeMirror 用于控制台仍然是非常理想的。

更新

问题实际上出在 react-codemirror 程序中。我可以使用更新且维护良好的react-codemirror2再次使用代码镜像进行反应。有关更多详细信息，请参阅此GitHub 问题。

于 2019-05-16T20:45:49.323 回答