React TinyMce：'tinymce'没有定义no-undef

Question

在使用tinymce的示例演示https://github.com/pc-magas/tinymce_demo我尝试通过https://www.tinymce.com/docs/api/tinymce/tinymce.editorcommands/中提供的api更改tinymce的内容在我的情况下，我希望当“hello”按钮被点击时插入编辑器内容中的“Hello”字符串。

，试图做到这一点是（https://github.com/pc-magas/tinymce_demo/blob/master/src/MyEditor.js）代码：

import React, { Component } from 'react'; 
import TinyMCE from 'react-tinymce'; 


/** 
* Basic Editor 
*/ 
class MyEditor extends Component { 

    constructor(props) { 
     super(props) 
     this.state={text:''} 
     this.tinyMCE=null; 
    } 

    onTextChange(e) { 
     this.setState({text:e.target.getContent()}) 
    } 


    doStuffWhenFileChanges(event) { 
     event.preventDefault(); 
     console.log(this.tinyMCE); 
     this.tinyMCE.context.execCommand('mceInsertContent', false ,"Hello"); 
    } 


    render(){ 
     return (
     <div> 
      <TinyMCE 
      ref = { (el)=>{ this.tinyMCE=el; } } 
      content = "" 
      config = {{ 
       plugins: 'link image code paste autolink media autoresize', 
       toolbar: 'undo redo | bold italic underline strikethrough | alignleft aligncenter alignright | media image link' 
      }} 
      onChange={this.onTextChange.bind(this)} 
      /> 
      <button onClick={ this.doStuffWhenFileChanges.bind(this) } >Hello</button> 
     </div> 
    ) 
    } 

} 


export default MyEditor; 

，但我得到了以下错误：

TypeError: this.tinyMCE.context.execCommand is not a function

我怎样才能访问该链接提供的API？

Answer 1

您可以通过window变量访问它。因此该行：

this.tinyMCE.context.execCommand('mceInsertContent', false ,"Hello"); 

将是：

window.tinymce.execCommand('mceInsertContent', false ,"Hello");