Почему я не могу это сделать? - PullRequest
0 голосов
/ 29 мая 2018

Я создаю приложение React Typescript и использую CKEditor, метод дает мне этот объект:

enter image description here

И когда я пытаюсь отрендерить его, это дает мне эту ошибку:

enter image description here

Может кто-нибудь объяснить мне, что я делаю не так?

Вот код:

export default class Toolbar extends React.Component<IProps, IState> {
  public toolbar: ToolbarView | undefined

  public componentDidMount() {
    this.toolbar = new ToolbarView()
    this.toolbar.render()
    console.log(this.toolbar.element) // the result is the first screenshot
  }

  public render() {
    return this.toolbar ? this.toolbar.element : null
  }
}

1 Ответ

0 голосов
/ 30 мая 2018

На самом деле, я смог добиться этого, используя ReactRef:

  public toolbarRef: React.RefObject<HTMLDivElement> = React.createRef()

  public componentDidMount() {
    // this.editor initialisation

    this.toolbar = new ToolbarView()
    // adding stuff to the toolbar
    this.toolbar.render()

    const el = ReactDOM.findDOMNode(this.toolbarRef.current as HTMLDivElement)
    if (el instanceof Element) {
      el.appendChild(this.toolbar.element)
    }
  }

  public render() {
    return (
        <div ref={this.toolbarRef} />
    )
  }
...