Question

我正在尝试对不同的页面使用路由，但是我在id中有多个get元素，因为在index.html中有一个基本模板。例如，如果我转到users页，则内容将重叠。如果我只使用1个html文件，则会出现此问题。

const routing = (
    <Router>
        <div>
            <Route path="/users" component={UserProfile} />
        </div>
    </Router>
)

ReactDOM.render(routing, document.getElementById('dashboard-left'))
// ReactDOM.render(<Sidebar />, document.getElementById('dashboard-left'));
ReactDOM.render(<Main/>, document.getElementById('main-section'))

我的HTML文件：

  <body>
    <div class="container-fluid bg-light">
      <div class="row">
        <!-- Dit is nav bar -->
        <div class="col-sm-2 min-vh-100 bg-primary full-img">
          <div class="py-2 sticky-top" id="dashboard-left">
            <!-- sidebar -->
          </div>
        </div>
        <div class="col-sm-10 d-flex flex-column">
          <div class="row flex-grow-1">
            <div class="col-sm-12 bg-primary">
              <h5 class="text-light pt-2">Dashboard</h5>
            </div>
            <div class="col-sm-12 min-vh-100 pt-5">
              <div class="card-columns" id="main-section">
                <!-- main.jsx rendering main section -->
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </body>

通过ID路由反应多个get元素

0 个答案: