React & Redux: получение неопределенной ошибки при доступе к реквизитам

Question

Я использую Redux с React для управления моим состоянием; однако я получаю ошибку undefined всякий раз, когда пытаюсь получить доступ к этому конкретному состоянию, которое выглядит хорошо и доступно через Redux Chrome Extension (см. изображение ниже)

На основе расширения Redux Chrome, объект memberDetails должен быть доступен для всех компонентов через this.props.memberDetails, но я получаю ошибку undefined.

Класс, к которому я обращаюсь memberDetails, выглядит следующим образом:

import React, {Component} from 'react';

class Details extends Component {


    render = () => {
        const   memberDetails = this.props.memberDetails;
        console.log("memberDetails: ", memberDetails);
        return (
            <div>

            </div>
        );
    }
}

export default Details;

Answer 1

Вы должны использовать функцию mapStateToProps, чтобы получить значение memberDetails из хранилища. Посмотри на это. https://react-redux.js.org/using-react-redux/connect-mapstate

    import React, {Component} from 'react';
    import { connect } from 'react-redux' 
    class Details extends Component {


        render = () => {
            const   memberDetails = this.props.memberDetails;
            console.log("memberDetails: ", memberDetails);
            return (
                <div>

                </div>
            );
        }
    }
    function mapStateToProps(state) {
  const { memberDetails } = state
  return { memberDetails }
}

export default connect(mapStateToProps)(Details)