CodeMirror:javascript提示不起作用

时间:2019-01-23 08:42:49

标签: reactjs codemirror

任何提示在我的React应用程序中均不起作用。

我相信有一个文本区域可以提供建议,但是这里没有人。

我导入了提示js和CSS

  

导入'codemirror / addon / hint / show-hint';

     

导入'codemirror / addon / hint / javascript-hint';

     

导入'codemirror / addon / hint / show-hint.css'

    constructor() {
        super();
        this.refCodeMirror= React.createRef();
        this.handleKeyUpEvent = this.handleKeyUpEvent.bind(this);
        this.autocomplete = this.autocomplete.bind(this);
    }

  autocomplete = function(cm) {
    const codeMirror = this.refCodeMirror.getCodeMirrorInstance();
      const hintOptions = {
          disableKeywords: true,
          completeSingle: false,
          completeOnSingleClick: false
      };
    codeMirror.showHint(cm, codeMirror.hint.javascript, hintOptions);
  };

  handleKeyUpEvent = function (e) {
      let cm = this.refCodeMirror.getCodeMirror();
      this.autocomplete(cm);
  };

  render() {
    const { code } = this.props;
    const { classes } = this.props;
    this.options = {
      completeSingle: false,
      mode: { name: 'javascript', json: true },
      autocorrect: true,
      addModeClass: true,
      value: 'const a = 1',
      autoComplete: 'on',
      extraKeys: { 'Tab': this.autocomplete },
    };
      let myRef = (el) => this.refCodeMirror = el;
    return (
        <CodeMirror
          ref={myRef}
          value={code}
          options={this.options}
          style={stylesCode}
          onChange={this.handleKeyUpEvent}
        />
    );
  }

0 个答案:

没有答案