Question

我正在使用react，我有这3个文件（组件，动作和减速器）。他们在这里：

cart.js 看起来像这样：

import React, {Component} from 'react';
import { connect } from 'react-redux';
import { fetchMyWishlist } from '../actions/index';
class Cart extends Component {

  constructor(props) {
    super(props);
  }

  componentWillMount(){
      this.props.fetchMyWishlist(this.props.signedInUserInfo._id);
    }
  }

  renderWishList(){
          console.log("ANOTHER TEST:"+ JSON.stringify(this.props.currentCart));
  }

  render(){
    return ({this.renderWishlist()});
  }
}



  function mapStateToProps(state){
    console.log("TEST: "+state.bookReducer.currentCart);
    return {
      currentCart: state.bookReducer.currentCart
    };
  }

  export default connect(mapStateToProps, {fetchMyWishlist})(Cart);

我的操作就是这个内部动作/ index.js：

export function fetchMyWishlist(userId){
  let url = 'http://localhost:3001/cart/'+userId;
  return function (dispatch) {
    axios.get(url)
      .then(response => {
        dispatch({
          type: FETCH_WISHLIST,
          payload: response.data
        });
      });
    }
}

这是我的 reducer ：

import {FETCH_BOOKS} from '../actions/types';
import {FETCH_WISHLIST} from '../actions/types';
const INITIAL_STATE = { myBooks:[], currentCart:[] };

export default function(state = INITIAL_STATE, action) {
  switch (action.type) {
    case FETCH_BOOKS:
      return { ...state, myBooks:action.payload };
    case FETCH_WISHLIST:
      return { ...state, currentCart: action.payload };
    default:
      return state;
  }
}

我的问题是我无法理解为什么我从2 console.log获得这2个结果：

TEST: [object Object]
ANOTHER TEST: undefined

正如您所看到的，reducer完成了它的工作，但我无法理解为什么this.props.currentCart未定义。

Answer 1

我认为你错误地将args传递给JSON.stringify。难道你不能使用这样的东西

console.log("ANOTHER TEST: " + JSON.stringify(this.props.currentCart));

Answer 2

尝试将方法渲染更改为：

renderWishList(){
          console.log(this.props.currentCart);
  }

似乎你试图通过附加“另一个测试：”而不是json来使用JSON.stringify参数

//very wrong
JSON.stringify("ANOTHER TEST: "+this.props.currentCart));

Answer 3

this.props.currentCart将是未定义的，因为它的上下文将成为窗口。

如果您在render方法中记录props的内容，您应该会看到预期的值。

请参阅this :)关于正确绑定上下文的文章

props未定义但状态已定义

3 个答案: