我想在树的最后一个节点中呈现包含img,popular,name,id,url等的信息,然后将它传递给它的父节点。
我正在尝试访问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", …}