在React功能組件中更改道具時，CodeMirror值未更新

Question

我嘗試使用收到的道具更新我的CodeMirror組件（從react-codemirror導入）的值，但是即使道具發生了變化，該值也不會發生變化。 而且由於我是使用corsanywhere從API加載來克服CORS限制的，所以有時提取請求失敗。 但是，成功獲取后，該值仍不會更新。

這是我的嘗試的屏幕截圖：

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

請參閱下面的答案以獲取解決方案

Answer 1

我通過用常規的textarea替換CodeMirror組件來解決了這個問題，它會相應地更新其值。 但是，我仍然希望有人解釋CodeMirror值更新問題的原因。 我正在為代碼編輯器和控制台尋找一致的外觀和樣式，因此仍然非常希望將CodeMirror用於控制台。

更新資料

問題實際上出在react-codemirror程序中。 我能夠使用更新且維護良好的react-codemirror2再次使用代碼鏡像。 有關更多詳細信息，請參見此GitHub問題 。