Warning: file_get_contents(/data/phpspider/zhask/data//catemap/4/powerbi/2.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript MapStateTrops对象未定义_Javascript_Reactjs_React Redux_Undefined_Jsx - Fatal编程技术网

Javascript MapStateTrops对象未定义

Javascript MapStateTrops对象未定义,javascript,reactjs,react-redux,undefined,jsx,Javascript,Reactjs,React Redux,Undefined,Jsx,我正在调用我的API,以使用其id获取特定对象 当我在mapstatetops方法中调用console.log时,会打印整个对象,但当我尝试使用this.props.anuncio访问它时,状态的“anuncio”属性未定义。我做错了什么 下面是我如何使用减速器和动作 import React from 'react' import PropTypes from 'prop-types' import { fetchAnuncio } from '../../actions/anuncios';

我正在调用我的API,以使用其id获取特定对象

当我在
mapstatetops
方法中调用
console.log
时,会打印整个对象,但当我尝试使用
this.props.anuncio
访问它时,状态的“anuncio”属性未定义。我做错了什么

下面是我如何使用减速器和动作

import React from 'react'
import PropTypes from 'prop-types'
import { fetchAnuncio } from '../../actions/anuncios';
import { connect } from 'react-redux';
import Avatar from 'react-avatar';
import star from '../../imgs/star.png';

class AnuncioDetalhes extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      id: this.props.anuncio ? this.props.anuncio.id : null,
      img: this.props.anuncio ? this.props.anuncio.img : null
    }
  }


  componentDidMount() {
    if (this.props.match.params.id) {
      this.props.fetchAnuncio(this.props.match.params.id);
    }
  }

  render () {
    const {id, img} = this.state;
    return (
      <div>
      </div>

    );
  }
}

AnuncioDetalhes.propTypes = {
  fetchAnuncio: PropTypes.func.isRequired,
  history: PropTypes.object.isRequired
}

  function mapStateToProps(state, props) {

  if(props.match.params.id) {
    console.log(state.anuncios.find(item => item.id === 4))
    return {
      anuncio: state.anuncios.find(item => item.id === props.match.params.id)
    }
  }
  return { anuncio: null };
}

export default connect(mapStateToProps, {fetchAnuncio})(AnuncioDetalhes);
行动:

import { SET_ANUNCIOS, ANUNCIO_FETCHED } from '../actions/types';

export default function anuncios(state = [], action = {}) {
  switch(action.type) {

    case ANUNCIO_FETCHED:
      const index = state.findIndex(item => item.id === action.anuncio.id);

      if(index > -1) {
        return state.map(item => {
          if (item.id === action.anuncio.id) return action.anuncio;
          return item;
        });
      } else {
        return [
          ...state,
          action.anuncio
        ];
      }

    case SET_ANUNCIOS:
      return action.anuncios;
    default: return state;
  }
}
import axios from 'axios';
import Constants from '../components/Constants'
import { SET_ANUNCIOS, ANUNCIO_FETCHED } from './types';


export function setAnuncios(anuncios) {
  return {
    type: SET_ANUNCIOS,
    anuncios
  }
}

export function anuncioFetched(anuncio) {
  return {
    type: ANUNCIO_FETCHED,
    anuncio
  };
}

export function fetchAnuncios(cidade) {
  return dispatch => {
    return axios.get(Constants.BASE_URL + "anuncios/?user__cidade=" + cidade + "&status=2").then(res => {
      dispatch(setAnuncios(res.data.results));
    });
  }
}

export function fetchAnuncio(id) {
  return dispatch => {
    return axios.get(Constants.BASE_URL + "anuncios/" +`${id}`).then(res => {
      dispatch(anuncioFetched(res.data));
    });
  }
}

我认为您应该使用
componentWillReceiveProps
lifecycle方法来获取更新的道具

componentWillReceiveProps = (nextProps)  => {
    console.log(nextProps)
} 

this.state={id:props.anuncio?props.anuncio.id:null,img:props.anuncio?props.anuncio.img:null}
在您的构造函数中尝试类似的方法它不会记录一个字您是否将它添加到
AnuncioDetalhes
类中?更改
props.match.params.id
parseInt(props.match.params.id,10)