React-ace: 光标不在正确的位置

你好
我有同样的问题
我使用了演示中的一个示例（http://securingsincity.github.io/react-ace/）
从我的代码中删除fontSize = {14}帮助了我

@huangjiatian @RTKSoftware我发现这条推文可能对你有帮助https://twitter.com/Maluen0/status/862636368857583616听起来像是灵魂的确切问题

当 CSS 中的字体大小与我传递给编辑器道具的值不同时，我遇到了这个问题。 通过从 CSS 中删除字体大小解决了该问题。

同样的问题。 请修复。 或者提供解决方法。

@MaximusDesign我也遇到了这个问题，发现 ace 依赖于等宽字体。
在我的情况下，问题是由于全局字体系列设置覆盖了 ace 设置的monaco引起的。

我发现我可以通过将编辑器中的字体设置为等宽字体或简单地inherit来解决

我们正在使用 styled-components，所以我们的解决方案看起来像这样。

const Editor = styled(AceEditor)`
    * {
        font-family: inherit;
    }
`;

我在删除或添加到编辑器时使用了类似的问题，光标距离实际位置 4 个空格。 与@MatthewLarner类似，我们使用styled-components ，但将字体系列设置为 Ace 的默认consolas并降低了行高：

 const StyledEditor = styled.div`
      margin-top: 10px;
      * {
        font-family: consolas;
        line-height: 1;
      }
    `;

    return (
      <StyledEditor>
        <AceEditor
        mode="json"
        theme="solarized_dark"
        fontSize={14}
        value={''}
        setOptions={{
          showLineNumbers: false,
          tabSize: 2,
        }}
        editorProps={{ $blockScrolling: true }}
      />
      </StyledEditor>
    );

我遇到了同样的问题，但是上面的所有方法都不起作用，然后我从原始 ace 搜索解决方案，
我得到了这个https://github.com/ajaxorg/ace/issues/2548 。 确定字体会导致光标问题。 将字体更改为monospace为我工作。
.ace_editor, .ace_editor div{ font-family:monospace }