reactjs – React Router v4 – 错误：React.Children.only预计

发布时间：2020-12-15 20:15:16 所属栏目：百科来源：网络整理

导读：我在一个非常简单的应用程序中使用react router v4.我试图按照文档,但我的应用程序尝试启动时有一个奇怪的错误. 错误说：错误：React.Children.only期望收到一个React元素子奇怪的是我的ReactDOM.render函数中只有一个组件. 这是我的代码的一些片段： index

我在一个非常简单的应用程序中使用react router v4.我试图按照文档,但我的应用程序尝试启动时有一个奇怪的错误.

错误说：错误：React.Children.only期望收到一个React元素子

奇怪的是我的ReactDOM.render函数中只有一个组件.

这是我的代码的一些片段：

index.js：

ReactDOM.render(
  <App />,document.getElementById('root')
);

app.js(我隐藏了所有明显的组件导入)：

import { BrowserRouter as Router,Route } from 'react-router-dom'

class App extends Component {
  render() {
    return (
      <Router>
        <div className="App">
          <Route path='/'>
            <Header/>
            <div className="search-container">
              <SearchBar/>
              <AddMovieButton/>
            </div>
            <SearchResultsList/>
          </Route>
          <Route exact path='/new'>
            <AddMovieForm/>
          </Route>
        </div>
      </Router>
    );
  }
}

export default App;

我真的不明白为什么这不起作用,为什么我有这个错误.

解决方法

您可以在Route中只有一个子元素.如果你想要多个,请用div包装它们,如下所示.

<Route path="/">
  <div>
    <Header />
    <div className="search-container">
      <SearchBar />
      <AddMovieButton />
    </div>
    <SearchResultsList />
  </div>
</Route>;

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!