Cara menampilkan container induk di Router utama

Saya mencoba menampilkan komponen container dan menggunakan router reaksi versi lama, saya melihat orang melakukan ini:

const AppRouter = () => (
  <Router component={App}>
    <Route exact path="/" component={Dashboard} />
  </Router>
);

Tampilan komponen Aplikasi saya:

import React, { PropTypes } from 'react';


class App extends React.Component {
  render() {
    return (
        <div>
          <p>Hello...</p>
          {this.props.children}
        </div>
      );
  }
}

export default App;

Package.json saya saat ini memiliki ini:

dependencies": {
    "history": "^4.7.2",
    "moment": "^2.20.1",
    "react": "^16.2.0",
    "react-dnd": "^2.5.4",
    "react-dnd-html5-backend": "^2.5.4",
    "react-dom": "^16.2.0",
    "react-redux": "^5.0.6",
    "react-router": "^4.2.0",
    "react-router-dom": "^4.2.2",
    "react-router-redux": "^4.0.8",
    "redux": "^3.7.2",
    "redux-thunk": "^2.2.0"
  },

BTW, apakah saya perlu mengimpor react-router dan react-router-dom dan react-router-redux saat menggunakan react-router 4.2?


person Blankman    schedule 21.01.2018    source sumber
comment
Apakah Anda mencoba merender komponen berdasarkan rute di dalam komponen Aplikasi Anda?   -  person Rosmarine Popcorn    schedule 22.01.2018
comment
Saya rasa Anda tidak bisa menggunakan Router seperti itu, setidaknya tidak di react-router v4. Yang dapat Anda lakukan adalah menggunakan ‹Route Component={App}› yang hanya menggunakan Route saja. Dan kemudian Anda membungkus Router di sekitar semua itu. Anda tidak perlu mengimpor react-router jika Anda sudah mengimpor react-router-dom, dan Anda tidak perlu mengimpor redux jika Anda tidak menggunakannya   -  person kng    schedule 22.01.2018


Jawaban (2)


Anda cukup menulisnya seperti itu:

const AppRouter = () => (
  <Router>
    <div>
      <App />
      <Route exact path="/" component={Dashboard} />
    </div>
  </Router>
);
person Matus    schedule 22.01.2018
comment
Saya mendapat kesalahan: A <Router> may have only one child element - person Blankman; 23.01.2018

Harap turunkan router reaksi ke 2.3.0.

Semoga ini berhasil.

person Japar Sathik    schedule 22.01.2018