React丨componentWillReceiveProps

问题描述

同一个页面，通过参数uuid区分，不同功能

• /conf/main - 新增页面
• /conf/main?uuid=1667c084b2104ca58759c9a88cbd96f6 - 修改页面

问题：从修改页面 路由跳转 新增页面， 不执行componentWillMount函数，导致不改变props ?

解决问题

在这个生命周期中，可以在子组件的render函数执行前获取新的props，从而更新子组件自己的state。 可以将数据请求放在这里进行执行，需要传的参数则从componentWillReceiveProps(nextProps)中获取。而不必将所有的请求都放在父组件中。于是该请求只会在该组件渲染时才会发出，从而减轻请求负担。componentWillReceiveProps在初始化render的时候不会执行，它会在Component接受到新的状态(Props)时被触发，一般用于父组件状态更新时子组件的重新渲染

componentWillReceiveProps(nextProps, nextContext) {
    // 判断uuid是否改变。如果没有改变直接return；如果改变了做你想做的事情
    if (this.props.location.query.uuid === nextProps.location.query.uuid) {
        return
    } else {
       // todo...
    }
}

参考资料

https://blog.csdn.net/RuiKe1400360107/article/details/89554600