Simple wrapper for react-codemirror2 to make it work well with Antd(Version 3.x) form component(<Form>).

App.jsx

import React from "react";
// antd version 3.26
import {Form} from "antd";
// react-codemirror2 version 7.2.1
import {Controlled as CodeMirror} from "react-codemirror2";
import CodeMirrorWrapper from "./CodeMirrorWrapper";

import "codemirror/lib/codemirror.css";
import "codemirror/theme/material.css";

class App extends React.Component {
  render() {
    return (
      <div className="wrapper">
        <Form>
          <Form.Item label="👎 Below's a code mirror that's NOT working">
            {this.props.form.getFieldDecorator("content1", {
              initialValue: "I'm not working well."
            })(
              <CodeMirror options={{ theme: "material" }} />
            )}
          </Form.Item>

          <br />

          <Form.Item label="👍 This one's working fine">
            {this.props.form.getFieldDecorator("content2", {
              initialValue: "I'm working fine."
            })(
              <CodeMirrorWrapper options={{ theme: "material" }} />
            )}
          </Form.Item>
        </Form>
      </div>
    );
  }
}

export default Form.create()(App)

CodeMirrorWrapper.jsx

import React from "react";
import {Controlled as CodeMirror} from "react-codemirror2";

class CodeMirrorWrapper extends React.Component {
  handleChange = (editor, data, value) => {
    this.props.onChange(value)
  };

  render() {
    // Antd's getFieldDecorator needs value & onChange
    // https://3x.ant.design/components/form-cn/#this.props.form.getFieldDecorator(id,-options)
    const {value, onChange, ...restProps} = this.props;
    return (
      <CodeMirror
        value={value}
        onBeforeChange={this.handleChange}
        {...restProps}
      />
    );
  }
}

export default CodeMirrorWrapper

A working demo >>