javascript - 如何在 React js 中接收更新的道具？

Question

你能告诉我如何在 React js 中接收更新的道具吗？我知道componentWillReceiveProps是unsafe并且我尝试使用getDerivedStateFromProps但不起作用

这是我的代码 https://codesandbox.io/s/rm30zoonk4

两秒钟后，我正在更新正在传递的状态props

Expected output after two second

abcsssss

static getDerivedStateFromProps(nextProps, prevState) {
    if (nextProps.src !== "") {
      return { src: nextProps.src };
    } else return null;
  }

标签： javascriptreactjsredux

Answer 1

您可以使用componentDidUpdate

更新发生后立即调用 componentDidUpdate()。

https://reactjs.org/docs/react-component.html#componentdidupdate

class Hello extends Component {
    state = {
        name: ""
    }
    componentDidUpdate(prevProps) {
        if (this.props.src !== prevProps.src) {
            this.setState({name: this.props.src + 'ssss'});
        }
    }
    render() {
        return <div>{this.state.name}</div>;
    }
}