Question

我创建了以下代码

<Route path="/" component={App}>
  <Route path="admin" component={BasicSet}>
    <IndexRoute component={Product_Category} />
    <Route path="product">
      <Route path="category" component={Product_Category} />
      <Route path="register" component={Product_Register} />
      <Route path="manage" component={Product_Mgt} />
      <Route path="brand" component={Product_Brand} />
    </Route>
    <Route path="library">
      <Route path="promotion" component={Library_Promotion} />
      <Route path="best" component={Library_Best} />
    </Route>
  </Route>
</Route>

我改变了下面的代码

<Route path="admin" component={BasicSet}

更改代码后，只有<Route path="admin" component={BasicSet}有效。除此之外，没有显示任何页面。在控制台中，没有错误。当我删除<Route path="/" component={App}> <IndexRoute component={Product_Category} /> <Route path="product"> <Route path="category" component={Product_Category} /> <Route path="register" component={Product_Register} /> <Route path="manage" component={Product_Mgt} /> <Route path="brand" component={Product_Brand} /> </Route> <Route path="library"> <Route path="promotion" component={Library_Promotion} /> <Route path="best" component={Library_Best} /> </Route> </Route>时，会显示所有页面。我不知道为什么。请解决这个问题。

此外，以下代码正在运作。

class BasicSet extends Component{
    render(){
        return(
          <div>
            <Nav />
            <Menu />
          </div>
        );
    }
}

BasicSet.jsx代码仅返回其他有效的组件。

{{1}}

Answer 1

试试这个，

class BasicSet extends Component{
    render(){
        return(
          <div>
            <Nav />
             {this.props.children}
            <Menu />
          </div>
        );
    }
}

react-router IndexRoute不起作用

1 个答案: