react monaco编辑器文本显示在编辑器的中间,尽管光标位于行的开头

我创建了一个简单的react应用程序 react-monaco-editor

import React, { Component } from 'react';
import MonacoEditor from 'react-monaco-editor';
import './App.css';

const code = `
import React from "react";

class App extends React.Component {
    render() {
        return (
            <span>I mean really come one</span>
        );
    }
}

export default App;
`;

class App extends Component {

  onChange = (value) => {
    console.log(value);
  }

  editorDidMount = (editor, monaco) => {
    console.log('editorDidMount', editor);
    editor.focus();
  }

  render() {
    const options = {
      selectOnLineNumbers: true
    };
    return (
      <div className="App">
        <MonacoEditor
          height="600"
          width="600"
          language="javascript"
          theme="vs-dark"
          value={code}
          onChange={this.onChange}
          editorDidMount={this.editorDidMount}
        />
      </div>
    );
  }
}

export default App;

由于某种原因,编辑器中的文本显示在中间,而我的光标与预期的一样是行首。