Olá! Estou com enorme dificuldade de chegar nos dados de uma uma numbered-list de um richtext pelo 'graphcms'(um CMS) para exibir em um blog com nextjs, formatado. Eu consigo chegar até o type por um switch(type), mas não estou conseguindo correr um .map para listar na tela. Bom, segue o código com algumas info e teste, não sei se consegui ser claro:
Um adendo, o
class='list-decimal'
é do tailwindOutro adendo, espero receber:
- lista numerada um
- lista numerada dois
- lista numerada três
- lista numerada um dentro do três
- lista numerada dois dentro do três
- lista numerada quatro
- lista numerada cinco
Estou recebendo aqui: undefined
cinco vezes
Alguém sabe ajudar o noob aqui?
const getContentFragment = (index, text, obj, type) => {
switch (type) {
case 'numbered-list':
return <p key={index} class="list-decimal">
<ol>
{modifiedText.map((item, i) =>
<li key={i}>
{item}
{console.log('aqui:',item)}
</li>)
}
</ol>
</p>;
}
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"></script>
Consegui chegar no text
, mas não estou conseguindo deixar o indice do array dinâmico para ir buscando os outros valores do array:
case 'numbered-list':
return <p key={index} class="list-decimal">
<ol>
{modifiedText.map((n,i) =>
<React.Fragment key={i}>
<li>
{console.log('aqui', obj.children[0].children[0].children[0].text)}
{obj.children[0].children[0].children[0].text}
</li>
</React.Fragment>
)
}
</ol>
</p>;
Estou recendo a linha 0 estática 5 vezes, não consegui deixar o children[0]
com o indice ao inves de 0.
Alguém sabe como faço?