OiO.lk Community platform!

Oio.lk is an excellent forum for developers, providing a wide range of resources, discussions, and support for those in the developer community. Join oio.lk today to connect with like-minded professionals, share insights, and stay updated on the latest trends and technologies in the development field.
  You need to log in or register to access the solved answers to this problem.
  • You have reached the maximum number of guest views allowed
  • Please register below to remove this limitation

ReactJS Error: react/jsx-no-undef by react-bootstrap

  • Thread starter Thread starter Maetha
  • Start date Start date
M

Maetha

Guest
I want to use menu bar in my project. First, I choose it from React-bootstrap but program has show an error about 'react/jsx-no-undef'.

This is code from React-bootstrap website.

Code:
const navbarInstance = (
<Navbar>
    <Navbar.Header>
      <Navbar.Brand>
        <a href="#">React-Bootstrap</a>
      </Navbar.Brand>
    </Navbar.Header>
    <Nav>
      <NavItem eventKey={1} href="#">Link</NavItem>
      <NavItem eventKey={2} href="#">Link</NavItem>
      <NavDropdown eventKey={3} title="Dropdown" id="basic-nav-dropdown">
        <MenuItem eventKey={3.1}>Action</MenuItem>
        <MenuItem eventKey={3.2}>Another action</MenuItem>
        <MenuItem eventKey={3.3}>Something else here</MenuItem>
        <MenuItem divider />
        <MenuItem eventKey={3.4}>Separated link</MenuItem>
      </NavDropdown>
    </Nav>
  </Navbar>
);
ReactDOM.render(navbarInstance, mountNode);

<p>I want to use menu bar in my project. First, I choose it from <a href="https://react-bootstrap.github.io/components.html#navbars" rel="nofollow noreferrer">React-bootstrap</a> but program has show an error about 'react/jsx-no-undef'.</p>

<p>This is code from <a href="https://react-bootstrap.github.io/components.html#navbars" rel="nofollow noreferrer">React-bootstrap</a> website.</p>

<pre><code>const navbarInstance = (
<Navbar>
<Navbar.Header>
<Navbar.Brand>
<a href="#">React-Bootstrap</a>
</Navbar.Brand>
</Navbar.Header>
<Nav>
<NavItem eventKey={1} href="#">Link</NavItem>
<NavItem eventKey={2} href="#">Link</NavItem>
<NavDropdown eventKey={3} title="Dropdown" id="basic-nav-dropdown">
<MenuItem eventKey={3.1}>Action</MenuItem>
<MenuItem eventKey={3.2}>Another action</MenuItem>
<MenuItem eventKey={3.3}>Something else here</MenuItem>
<MenuItem divider />
<MenuItem eventKey={3.4}>Separated link</MenuItem>
</NavDropdown>
</Nav>
</Navbar>
);
ReactDOM.render(navbarInstance, mountNode);
</code></pre>
 

Latest posts

Online statistics

Members online
0
Guests online
5
Total visitors
5
Top