在redux状态树中访问元素

时间:2017-10-06 04:16:51

标签: reactjs redux react-redux

我想在树的最后一个节点中呈现包含img,popular,name,id,url等的信息,然后将它传递给它的父节点。

Tree

我正在尝试访问Redux在这里放在一起的状态树中的大多数子项项:但是反应是抱怨我无法渲染对象,但是当我使用键编码标记元素时和.map我在屏幕上得到<ul>个字符串[obj][Obj],而不是我想要的子元素及其所有道具。

如何轻松地从树中渲染子元素(和道具),在这种情况下是项目列表及其属性到屏幕?

查看代码:

在Componenet

if (artists.items !== undefined) {
  return (
    <ul>
      { artists.items.map((artist, index) =>  <li key={index}>{`${artist}`}</li> )} 
    </ul>
  )
}

在reducer中使用inmmutableJS

  const initialState = Map({
  isFetching: false,
  artists: Map(),
  details: Map()
})


  export default function artist(state=initialState, action) {
  switch(action.type) {
    case RECEIVE_ARTISTS:
      return receiveArtists(state, action.artists)

    case FETCH_ARTISTS: 
      return fetchArtists(state)

    case RECEIVE_ARTIST_INFO:
      return receiveArtistInfo(state, action.artist)

    case FETCH_ARTIST_INFO:
     return fetchArtistInfo(state)

    default:
      return state 
    }
}

DATA

0:{external_urls: {…}, followers: {…}, genres: Array(3), href: "https://api.spotify.com/v1/artists/5WUlDfRSoLAfcVSX1WnrxN", id: "5WUlDfRSoLAfcVSX1WnrxN", …}
1:{external_urls: {…}, followers: {…}, genres: Array(0), href: "https://api.spotify.com/v1/artists/2nayTQuiuFt5fcSphlERqZ", id: "2nayTQuiuFt5fcSphlERqZ", …}
2:{external_urls: {…}, followers: {…}, genres: Array(0), href: "https://api.spotify.com/v1/artists/2c8C6NJx7VyLathetev2Og", id: "2c8C6NJx7VyLathetev2Og", …}

0 个答案:

没有答案