Button with Navigation to other page in navbar materialize react

Question

I wanted to insert buttons in the navbar of materialize to navigate to other pages. How can I create a button that helps me to open another page. I used the "Linked to" from react-router, but it doesn't work. Thank you very much for your response

import { Link } from "react-router-dom";  

<nav>
        <div class="nav-wrapper blue lighten-2">
          <a class="brand-logo left">
            <img scr="/images/logo_small.png"></img>
          </a>
          <ul id="nav-mobile" class="right hide-on-med-and-down">
            <li>
              <a href="teechrworks.html">How teechr works?</a>
            </li>
            <li>
              <a href="aboutus.html">About us</a>
            </li>
            <ul>
              <li>
                <Link to="/chooseachatbottype">Get started!</Link>
              </li>
            </ul>
            <Link style={navStyle} to="/createquiz1">
              <li>Create your quizbot!</li>
            </Link>
            <li>
              <a href="signin.html" a class="waves-effect waves-light btn">
                Sign in
              </a>
            </li>
          </ul>
        </div>
      </nav>
```

Answer 1

I just tried to clean up your code, as there was a Link outside a li element. This should work:

<nav>
  <div class="nav-wrapper blue lighten-2">
    <a class="brand-logo left">
      <img src="/images/logo_small.png"></img>
    </a>
    <ul id="nav-mobile" class="right hide-on-med-and-down">
      <li>
        <a href="teechrworks.html">How teechr works?</a>
      </li>
      <li>
        <a href="aboutus.html">About us</a>
      </li>
      <li>
        <Link to="/chooseachatbottype">Get started!</Link>
      </li>
      <li>
        <Link style={navStyle} to="/createquiz1">
          Create your quizbot!
        </Link>
      </li>
      <li>
        <a href="signin.html" a class="waves-effect waves-light btn">
          Sign in
        </a>
      </li>
    </ul>
  </div>
</nav>