Question

我像三天前一样，在尝试了解类组件中redux中的状态做出反应时遇到了这个错误，问题是当我尝试了解状态“ actualPersonAlbum”时，这是我的代码{{3} }

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减速器

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。

如果您希望它能正常工作，数据道具应该看起来像：

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

您不是只想一次进行销毁吗？

const { actualPersonAlbum } = this.props

但是，如果您真的想对该属性进行两次分解，请确保尚未定义actualPersonAlbum的可能性（因为它来自异步请求等）。

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

TypeError：无法读取未定义的属性“ actualPersonAlbum”

1 个答案: