用单击的文本手动更新DraftJs ContentState

Question

如何手动更新DraftJs的ContentState以响应单击的文本？

我有一个文本项目的列表。单击其中一个时，我将文本向下传递给Draftjs，但由于我使用componentWillReceiveProps()设置状态，因此需要单击文本两次才能获得更新。

 componentWillReceiveProps() {
    const activeNoteText = this.props.activeNoteText;
    if (activeNoteText !== '') {
      this.setState({ editorState: EditorState.createWithContent(ContentState.createFromText(activeNoteText)) });
    }
 }

第一次单击：更新应用程序状态并将道具传递给Draftjs (接收新道具之前的组件更新)

第二次单击：现在正确设置了支柱和Draftjs更新(在第一次单击时收到了组件更新)

我怎样才能一蹴而就呢？我知道没有componentDidReceiveProps，我知道有一个很好的理由，虽然我还不能完全理解，那么实现这种目标的最佳实践方法是什么呢？

Answer 1

你为什么要用componentwillReceiveProps？

您可以做的是让您在Draftjs中设置的状态，即editorState (嗯，这就是我所能理解的)在它的父元素中，每当在更新editorState的单击处理程序上单击一个列表项时，将它作为支持传递给草案js。

对于条件，如果要检查它是否为空，则可以使用

       getInitialState(){
     .....
    }

用于初始加载组件时的初始化。所以您可以有一个editorState的默认值。