Infelizmente a minha anotação de array está gerando erro... Eu passo conforme instruído na aula: Interface Produto: export interface IProduto { nomeProduto: string, valorProduto: number, fDesconto: any, children: any } Meu componente Card: import { IProduto } from "@/interfaces/IProduto"; function desconto(principal:number,preco_venda:number){ return principal - preco_venda } export default function Card(props: IProduto){ return (

0 ? 'border-4 border-red-700' : ''} rounded-sm p-1`}>

Nome do Produto: {props.nomeProduto}

Valor do Produto: R$ {props.valorProduto}

{/*

Valor de Venda: R$ {props.fDesconto}

*/} {desconto(props.valorProduto,props.fDesconto) > 0&&(

Desconto: R$ {desconto(props.valorProduto,props.fDesconto)}

Valor de Venda: R$ {props.fDesconto}

)}

{props.children[0]}

) } Erro gerado: TypeError: Cannot read properties of undefined (reading '0') at Card (turbopack://[project]/src/components/card.tsx:19:33) 17 | 18 | )} > 19 |

{props.children[0]}

| ^ 20 | 21 | ) 22 | } Alguma razão para isso? Node version: 20.13.1 package.json: { "name": "projeto1", "version": "0.1.0", "private": true, "scripts": { "dev": "next dev --turbopack", "build": "next build", "start": "next start", "lint": "next lint" }, "dependencies": { "react": "19.0.0-rc-02c0e824-20241028", "react-dom": "19.0.0-rc-02c0e824-20241028", "next": "15.0.2" }, "devDependencies": { "typescript": "^5", "@types/node": "^20", "@types/react": "^18", "@types/react-dom": "^18", "postcss": "^8", "tailwindcss": "^3.4.1", "eslint": "^8", "eslint-config-next": "15.0.2" } } Quando retiro a anotação de array, aí sim, funciona normalmente. Grato!

API Rest, Node e Typescript: #01 - Apresentação do curso

API Rest, Node e Typescript

Conteúdo do curso

CHILDREN, manipulando elementos filho do componente - Aula 15 - Curso de React Next Typescript