Я новичок в React и у меня (возможно) глупый вопрос. Как переключаться между РАЗНЫМИ страницами javascript в React.js?

У меня есть кнопка на одной из моих страниц, которую я хочу связать с другой страницей javascript. Я знаю о роутере, но он мне не подходит.

Web App Structure

Спасибо, Марк Брукерт

1
Mark_Bruckert 24 Сен 2018 в 01:50

2 ответа

Лучший ответ

Это основано на примере из документации response-router. React Router, вероятно, является самым простым решением маршрутизации на стороне клиента. Удачного кодирования.

См. Полный пример на Stackblitz.

import React, { Component } from 'react';
import { render } from 'react-dom';
import { BrowserRouter as Router, Route, Link } from 'react-router-dom';

const Nav = () => (
  <div>
    <ul>
      <li><Link to="/">Home</Link></li>
      <li><Link to="/about">About</Link></li>
    </ul>
  </div>
);

const HomePage = () => <h1>Home Page</h1>;
const AboutPage = () => <h1>About Page</h1>;

class App extends Component {
  constructor() {
    super();
    this.state = {
      name: 'React'
    };
  }

  render() {
    return (
      <Router>

        {/* Router component can have only 1 child. We'll use a simple
          div element for this example. */}
        <div>
          <Nav />
          <Route exact path="/" component={HomePage} />
          <Route path="/about" component={AboutPage} />
        </div>
      </Router>
    );
  }
}

render(<App />, document.getElementById('root'));
3
webprojohn 23 Сен 2018 в 23:39

Используйте react-router, чтобы определять свои страницы и переключаться между ними

https://reacttraining.com/react-router/

3
Vinod CG 23 Сен 2018 в 22:54