Os dados estão neste formato:
_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);
});
}
Então, quando estou executando isso, recebo:
erro reagir.js: 18893 Erro não capturado: os objetos não são válidos como um filho do React (encontrado: objeto com chaves {newItem}). Se você pretendia render uma coleção de filhos, use uma matriz ou agrupe o objeto usando createFragment (object) nos complementos do React. (…)
o que estou perdendo?
Existe outra maneira de contornar?
Respostas:
0 para resposta № 1Há duas questões aqui.. Uma é que você está retornando uma lista aninhada [[]] Eu acho que você provavelmente queria retornar apenas uma única lista []. você também está retornando {newItem} da sua função de mapa externo. Isso não é algo que o React possa renderizar. React precisa de um elemento de reação ou de uma lista de elementos de reação.
você quis fazer:
return this.props.tagsview.map(tags => {
return tags.map(p => <span className="tag" key={p.tag_id}>{p.name}</span>);
});
ou possivelmente
this.props.tagsview
.reduce((tags, view) => [...tags, ...view.map(t =><span className="tag" key={p.tag_id}>{p.name}</span>)], [])