javascript - 修复 Redux 有效负载正在控制台中登录减速器，但在模式中说无法读取 null 的属性？

Question

想知道你们是否可以帮我解决这个问题：

在我的行动中，我有：

export const getProduct = (id) => (dispatch) => {
  dispatch(setItemsLoading());
  axios.get(`http://localhost:5000/api/products/view/${id}`).then((res) =>
    dispatch({
      type: GET_ITEM,
      payload: res.data,
    })
  );
};

在减速机中：

case GET_ITEM:
  console.log(action.payload);
  return {
    ...state,
    /* items: action.payload, */
    singleItem: action.payload,
  };

控制台记录了我得到但在我的模型中的对象：

static propTypes = {
  isAuthenticated: PropTypes.bool,
  singleItem: PropTypes.object.isRequired
}

componentDidMount() {
  this.props.getProduct('5f4589e4b7b3aa98e4ca79ab')
}

<Label for="name">{this.props.item.name}</Label>
<Input type="text" name="name" id="name" placeholder="Product Name" onChange={this.onChange} />
<Label for="description">{this.props.item.description}</Label>

const mapStateToProps = state => ({
  item: state.item.singleItem,
  user: state.auth,
  isAuthenticated: state.auth.isAuthenticated
})

还有更多，但这已经足够了，我不断得到：

TypeError: Cannot read property 'name' of null
ProductModal.render
src/components/products/ProductModal.js:65
  62 | <ModalBody>
  63 |     <Form onSubmit={this.onSubmit}>
  64 |         <FormGroup>
> 65 |             <Label for="name">{this.props.item.name}</Label>
     | ^  66 |             <Input type="text" name="name" id="name" placeholder="Product Name" onChange={this.onChange} />
  67 |             <Label for="description">{this.props.item.description}</Label>
  68 |             <Input type="textarea" name="description" id="item" placeholder="description" onChange={this.onChange} />

我的有效载荷是：

_id(pin):"5f4589e4b7b3aa98e4ca79ab"
name(pin):"Cajun"
description(pin):"Mouth watering artisan freshly made beef jerky, made with love in Texas! - 8 OZ bag"
creator(pin):"Jenn & James"
imgUrl(pin):"http://dgegergerg.dev/masonsbeef/beef1.jpg"
quantity(pin):20
__v(pin):0

它是一个对象

标签： javascriptreactjsreact-redux