javascript - 类型错误 : Cannot read property 'actualPersonAlbum' of undefined

Question

就像三天前一样，当我尝试了解类组件 React 中 redux 的状态时，我正在处理这个错误，问题是当我尝试了解状态“actualPersonAlbum”时，这里是我的代码 image about the mistake

React class WorkSection extends React.Component {
  render() {
    const { classes } = this.props;
    const {relations} = this.props.relations;
    console.log(relations); 
    const {actualPersonAlbum} = this.props.actualPersonAlbum;  //The probleeeeeem 
    console.log(actualPersonAlbum);
    return (
       <section style={ sectionStyle }>
      </section>
    );
  }
}

WorkSection.propTypes = {
  classes: PropTypes.object
};

const mapStateToProps = state => ({
  relations: state.relations,
  actualPersonAlbum: state.actualPersonAlbum,
});

export default connect(mapStateToProps) (withStyles(workStyle)(withRouter(WorkSection)));

Redux reducer

import { GET_RELATIONS, 
  SET_ACTUAL_ALBUM_PERSON } from "../actions/types";

const initialState = {
    actualPersonAlbum: "",
};

export default function(state = initialState, action) {
  switch (action.type) {
    case SET_ACTUAL_ALBUM_PERSON:
        return{
    actualPersonAlbum:action.payload,

        };
    default:
      return state;
  }
}

Redux 操作

import {GET_RELATIONS,
    SET_ACTUAL_ALBUM_PERSON
} from "./types";
import axios from "axios";

export const setActualAlbumPerson = actualPersonAlbum => {
    return {
      type: SET_ACTUAL_ALBUM_PERSON,
      payload: actualPersonAlbum
    }
  }

Answer 1

您实际上想要做的是解构actualPersonAlbum。

如果您想让它起作用，数据 Prop 应该如下所示:

{ 
    actualPersonAlbum: {
        actualPersonAlbum: ...,
    },
}

您不是只想解构它一次吗？

const { actualPersonAlbum } = this.props

但是，如果您确实想对该属性进行两次解构，只需确保 actualPersonAlbum 尚未定义的可能性(因为它来自异步请求等)。

const { actualPersonAlbum } = this.props.actualPersonAlbum || {};