samedi 10 octobre 2020

A button from Jumbotron link to a button from navigation bar in React

I have navigation in Home, About, Modeling, and Resources. I am wondering how can add a link to a button from Jumbotron that will point to my Navigation.

In App.js

function App() {
  return (
    <div className="App">
      <Header />  
      <Jumbotron />
      <Layout>
          <Switch>
          <Route exact path="/" component={Home} />
          <Route path="/about" component={About} />
          <Route path="/modeling" component={Modeling} />
          <Route path="/resources" component={Resources} />
          </Switch>
          </Layout>
    
    </div>
  );
}

In Jumbotron.js

export const Jumbotron = () => (
  <Styles>
    <Jumbo fluid className="jumbo">
      <div className="overlay"></div>
      <Container className="center">
        <h1>Welcome 3D astronomical models</h1>
        <p>
        <button class="btn btn-success btn-lg btn-getStarted" href="#modeling" role="button">Get Started</button>
        <button class="btn btn-success btn-lg btn-getStarted" href="#about" role="button">Learn More</button>
        </p>
      </Container>
    </Jumbo>
  </Styles>
)

I use href="#modeling" but the page does not understand to go to page Modeling Can anyone help? I am using React

My web looks like this




Aucun commentaire:

Enregistrer un commentaire