2016-11-24 6 views
0

のレンダリング中にデータがこの形式である:私はこれを実行しているときエラーJSONデータ[Reactjs]

this.props.tagsview

_getTags() { 
 
    console.log(this.props.tagsview); 
 
    return this.props.tagsview.map(tags => { 
 
     var newItem = tags.map(p => <span className="tag" key={p.tag_id}>{p.name}</span>); 
 
     return ({newItem); 
 
    }); 
 
}

は、だから私は取得しています:

error react.js:18893 Uncaught Error: Objects are not valid as a React child (found: object with keys {newItem}). If you meant to render a collection of children, use an array instead or wrap the object using createFragment(object) from the React add-ons.(…)

私は何が欠けていますか?
別の方法がありますか?

答えて

0

ここには2つの問題があります。一つはネストされたリストを返すことです [[]]おそらくあなたはただ一つのリスト[]を返すことを望んでいたと思います。 あなたはまた、あなたの外側の地図機能から{newItem}を返しています。 これはReactがレンダリングできるものではありません。 リアクションにはリアクションエレメントまたはリアクションエレメントのリストが必要です。

、あなたは何をする意味した:

return this.props.tagsview.map(tags => { 
     return tags.map(p => <span className="tag" key={p.tag_id}>{p.name}</span>); 
    }); 

または多分

this.props.tagsview 
    .reduce((tags, view) => [...tags, ...view.map(t =><span className="tag" key={p.tag_id}>{p.name}</span>)], []) 
関連する問題