componentWillReceiveProps не вызывается при изменении реквизитов redux

Мой компонент прямолинейен: 

import React, {Component} from 'react';
import {connect} from 'react-redux';
import {bindActionCreators} from 'redux';

import * as instanceActions from '../../../store/instances/instancesActions';

class InstanceDetailsPage extends Component {

    componentWillReceiveProps(nextProps) {
        console.log('will receive props');
        if (nextProps.id !== this.props.id){
            this.updateInstanceDetails();
        }
    }

    updateInstanceDetails = () => {
        this.props.actions.loadInstance(this.props.instance);
    };

    render() {
        return (
            <h1>Instance - {this.props.instance.name}</h1>
        );
    }
}

function getInstanceById(instances, instanceId) {
    const instance = instances.filter(instance => instance.id === instanceId);
    if (instance.length) return instance[0];
    return null;
}

function mapStateToProps(state, ownProps) {
    const instanceId = ownProps.match.params.id;
    let instance = {id: '', name: ''};
    if (instanceId && state.instances.length > 0) {
        instance = getInstanceById(state.instances, instanceId) || instance;
    }
    return {
        instance,
    };
}

function mapDispatchToProps(dispatch) {
    return {
        actions: bindActionCreators(instanceActions, dispatch)
    };
}

export default connect(mapStateToProps, mapDispatchToProps)(InstanceDetailsPage);

Мой редуктор, который я почти уверен, что не мутирую состояние: 

import * as types from '../actionTypes';
import initialState from '../initialState';

export default function instancesReducer(state = initialState.instances, action) {
    switch (action.type){
        case types.LOAD_INSTANCES_SUCCESS:
            return action.instances.slice(); // I probably don't event need the .slice() here, but just to be sure.
        default:
            return state;
    }
}

Я точно знаю, что изменение состояния, которое запускает props, меняется, потому что я зарегистрировался this.props на методе render, и props менялся пару раз! При этом componentWillReceiveProps не был вызван ни разу.

Что может быть причиной этого?

1 2
reactjs react-redux

1 ответ:

Есть несколько причин, по которым componentWillReceiveProps не будет вызываться,

  • если он не получает новый объект реквизита из магазина redux
  • Кроме того, эти методы не вызываются, если компонент монтируется. Таким образом, вы можете увидеть обновление вашего компонента, но на самом деле это просто монтирование и размонтирование. чтобы исправить это, загляните в родительский рендеринг этого компонента и проверьте, является ли он рендерингом компонента с другим ключом или существует какая-то условность рендеринг, который может вернуть false и заставить react размонтировать его.
1