@uiw/react-codemirror 滚动

Question

我正在使用 uiw-react codemirror。我使用 uiw codemirror 提供的 classnameExt 函数将类名添加到 codemirror 中的特定行。我可以访问特定行的类名和行号。我想通过单击按钮滚动到该特定行。

   `<CodeMirror
      id="codemirrorId"
      value={value}
      height={height}
      theme={darkMode ? aura : xcodeLight}
      extensions={extensions}
      onChange={onChange}
      readOnly={readOnly}
      color="text.primary"
    />`

这是我的代码镜像组件，我如何滚动到具有我的类名的特定行？

提前致谢:)

Answer 1

 const scroller = document.getElementsByClassName("cm-scroller")[0];
    if (scroller) {
      const totalLines = 200     /* total number of lines */
      const totalHeight = scroller.scrollHeight;
      const singleLineHeight = totalHeight / totalLines;
  
      scroller.scrollTop = (singleLineHeight * x);   /*x is the line number to scroll to*/
    }