I want to create the navbar by using react-bootstrap I put the code as below in src\components\header.tsx which want to make header as component :
import Container from 'react-bootstrap/Container';
import Nav from 'react-bootstrap/Nav';
import Navbar from 'react-bootstrap/Navbar';
import NavDropdown from 'react-bootstrap/NavDropdown';
function BasicExample() {
return (
<Navbar expand="lg" className="bg-body-tertiary">
<Container>
<Navbar.Brand href="#home">React-Bootstrap</Navbar.Brand>
<Navbar.Toggle aria-controls="basic-navbar-nav" />
<Navbar.Collapse id="basic-navbar-nav">
<Nav className="me-auto">
<Nav.Link href="#home">Home</Nav.Link>
<Nav.Link href="#link">Link</Nav.Link>
<NavDropdown title="Dropdown" id="basic-nav-dropdown">
<NavDropdown.Item href="#action/3.1">Action</NavDropdown.Item>
<NavDropdown.Item href="#action/3.3">Something</NavDropdown.Item>
</NavDropdown>
</Nav>
</Navbar.Collapse>
</Container>
</Navbar>
);
}
export default BasicExample;
but it return the error on navbar.brand or container
Type 'Element' is not assignable to type 'ReactNode'.
Property 'children' is missing in type 'Element' but required in type 'ReactPortal'.ts(2322)
index.d.ts(207, 9): 'children' is declared here.
index.d.ts(1466, 9): The expected type comes from property 'children' which is declared here on type 'IntrinsicAttributes & Omit<Omit<DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>, "ref"> & { ...; }, BsPrefixProps<...> & NavbarProps> & BsPrefixProps<...> & NavbarProps & { ...; }'
can I know what's wrong inside
you can update your @types/react, I had same error, but after update @types/react to last version, error go away, my currect version 18.2.64 example error