为什么我收到错误&Quot；表达式必须有一个父元素&Quot；，我该如何解决这个问题？ [英] Why do I get the error "expressions must have one parent element", how do I fix this?

问题描述

我的反应相对较新，我想知道这里的标准是什么。

假设我有一个这样的反应路由器：

<Router history={history}>
    <Route path="/" component={App}>
      <Route path="home component={Home} />
      <Route path="about" component={About} />
      <Route path="inbox" component={Inbox} />
      <Route path="contacts" component={Contacts} />
    </Route>
</Router>

现在，如果prop.mail设置为false，我想删除两个路由，因此合理的方法如下所示：

<Router history={history}>
      <Route path="/" component={App}>
        <Route path="home component={Home} />
        <Route path="about" component={About} />

        { if.this.props.mail ? 
          <Route path="inbox" component={Inbox} />
          <Route path="contacts" component={Contacts} />
        : null }

      </Route>
 </Router>

但有2个路由和Reaction返回错误：

表达式必须有一个父元素。

我不想在这里使用多个if。处理此问题的首选反应方式是什么？

推荐答案

将其放入数组(同时分配键)：

{ if.this.props.mail ? 
    [
        <Route key={0} path="inbox" component={Inbox} />,
        <Route key={1} path="contacts" component={Contacts} />
    ]
: null }

使用最新的Reaction版本，您还可以尝试React.Fragment，如下所示：

{ if.this.props.mail ? 
    <React.Fragment>
        <Route path="inbox" component={Inbox} />,
        <Route path="contacts" component={Contacts} />
    </React.Fragment>
: null }

这篇关于为什么我收到错误&Quot；表达式必须有一个父元素&Quot；，我该如何解决这个问题？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！