/ / Erro ao renderizar dados json [Reactjs] - javascript, reactjs

Erro ao renderizar dados json [Reactjs] - javascript, reactjs

Os dados estão neste formato:

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);
});
}

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 № 1

Há 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>)], [])