javascript - prevProps.search.query 始终与 this.props.search.query 相同

Question

在分派(dispatch)操作更新 redux 状态后，

prevProps.search.query 始终与 this.props.search.query 相同。

如果我在输入中输入“testing”并在 componentDidUpdate() 中记录 this.props.search.query 和 prevProps.search.query code> 他们都会打印“testing”

prevProps.search.query 不应该是 testin (没有 h，因为它是上一个搜索查询)？

// results component

class Results extends React.Component {

  constructor (props) {

    super(props);

    this.state = {
      resultsClass: 'row search-results',
      results: null,
      searchQuery: ''
    }
  }

  componentDidUpdate(prevProps, prevState){

    if(this.props.search.query !== prevProps.search.query){
      this.getSearchResults();
    }

  }

}

// input component

<input type="text" onChange={this.handleSearchUpdate} />

handleSearchUpdate() {

  this.props.dispatch(setSearchQuery(this.queryInput.value));

}

在我的 reducer 中，我正在设置状态

case constants.SET_SEARCH_QUERY:
        return merge({}, set(state, 'search.query', action.query));

Answer 1

我认为你把它误认为是 componentWillReceiveProps。如果您需要 nextProps

，您应该使用 componentWillReceiveProps(nextProps)

在此处了解更多信息 https://facebook.github.io/react/docs/react-component.html#componentwillmount