React 15 / Redux - обновить компонент после смены реквизита - PullRequest
0 голосов
/ 09 января 2019

У меня есть вопрос об обновлении реквизита. У меня есть компонент, подключенный к избыточному магазину. Когда корневой компонент монтируется, я вызываю ajax-запрос и обновляем хранилище Мой подключенный компонент получает новые реквизиты, но он не рендерится повторно (вариантов нет). Я знаю, что могу обновить внутреннее состояние подключенного компонента, но ... это необходимо?

componentWillReceiveProps

receive props
 {agreements: Array(4), actions: {…}} //nextProps
 {agreements: Array(0), actions: {…}} //this.props

Нажмите кнопку обновления

refresh {agreements: Array(4), actions: {…}} //this.props

Мой подключенный компонент

import React, { Component } from 'react';
import { connect } from 'react-redux';
import { bindActionCreators } from 'redux';
import PropTypes from 'prop-types';
import * as agreementActions from '../../actions/agreementActions';

class ChangeAgreement extends Component {
    constructor(props) {
        super(props);
        this.refresh = this.refresh.bind(this);
    }

    refresh()
    {
        console.log('refresh');
        console.log(this.props);
    }

    componentWillReceiveProps(nextProps, prevState) {
        console.log('receive props');
        console.log(nextProps);
        console.log(this.props);
    }

    render() {
        const { agreements } = this.props;

        return (
            <div>
                Pick agreement
                <button onClick={this.refresh}>Refresh</button>
                <select>
                    {agreements.map((item) => {
                        <option value={item.ID}>{item.NM}</option>;
                    })}
                </select>
            </div>
        );
    }
}

function mapStateToProps(state) {
    return {
        agreements: state.agreements
    };
}

function mapDispatchToProps(dispatch) {
    return {
        actions: bindActionCreators(Object.assign({}, agreementActions), dispatch)
    };
}

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

1 Ответ

0 голосов
/ 09 января 2019

Ваша функция стрелка

agreements.map((item) => {
                        <option value={item.ID}>{item.NM}</option>;
                    })

возвращает undefined. Вы забыли return.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...