数组似乎已填满,直到我尝试使用它

时间:2018-06-12 09:52:06

标签: javascript reactjs redux

我有一个Object,其中包含我要映射的项目数组。当我在console.log中时,它将返回Object和填充的数组。

从console.log(this.props.pkmns)输出

{
  "pkmns": [
    {
      "url": "http://pokeapi.salestock.net/api/v2/pokemon-species/1/",
      "name": "bulbasaur"
   },
    {
      "url": "http://pokeapi.salestock.net/api/v2/pokemon-species/2/",
      "name": "ivysaur"
    },
    {
      "url": "http://pokeapi.salestock.net/api/v2/pokemon-species/3/",
      "name": "venusaur"
    }
  ]
}

当我专门调试console.log数组时,它返回空。

从console.log输出

(this.props.pkmns.pkmns):

[]

代码

class PkmnContainer extends React.Component {
  componentDidMount(props){
    return this.props.startPkmn()
}

  render(){
    return(
      <div>
        {console.log(this.props.pkmns)}
        {console.log(this.props.pkmns.pkmns)}
        {this.props.pkmns.pkmns.map((pkmns)=>{
          <p>{pkmns}</p>
        })}
      </div>
    )
  }
}

const mapStateToProps = state => {
  return {
    'pkmns': state.pkmns
  }
}

const mapDispatchToProps = dispatch => ({
  startPkmn: () => {
    return dispatch.pkmns.start()
  }
})

export default connect(mapStateToProps, mapDispatchToProps)(PkmnContainer);

如何才能通过此数组进行映射?

full code here

1 个答案:

答案 0 :(得分:-4)

this.props.pkmns.pkmns.map((pkmns)=>{
      <p>{pkmns}</p>
    })

似乎有一个错字和一个pkmns太多了。尝试使用this.props.pkmns.map