Question

return (

  <Router>
    <div className="banner" >
  <div >
    <ul>
       <li><Link className="a" to={'/'}>•Home</Link></li>
       <li><Link className="a" to={'/about'}>•About</Link></li>     
       <li><Link className="a" to={'/LoginForm'}>•Login</Link></li>
       <li><Link className="a" to={'/gallery'}>•Gallery</Link></li>
       <li><Link className="a"to={'/services'}>•Services</Link></li>
       <li><Link className="a"to={'/contact'}>•Contact</Link></li>
     </ul>
    </div>
      <hr/>

      <Switch>
      <Route exact path="/" component={Home} />
      <Route path="/about" component={About} />
      <Route path="/LoginForm" component={LoginForm}/>
      <Route path="/gallery" component={Gallery}/>
      <Route path="/services" component={Services}/>
      <Route path="/contact" component={Contact}/>
      </Switch>
    </div>

  </Router>

  <div className="w3-content w3-display-container">
  <img className="mySlides" src={image1.jpg} style="width:100%">
  <img className="mySlides" src={image2.jpg} style="width:100%">
  <img className="mySlides" src={image3.jpg} style="width:100%">
  <img className="mySlides" src={image4.jpg} style="width:100%">
  <img className="mySlides" src={image5.jpg} style="width:100%">
  <img className="mySlides" src={image6.jpg} style="width:100%">
  </div>


    );

这是我的代码..但是语法错误：E：/Projects/react-redux-login/src/components/HomePage/HomePage.js：相邻的JSX元素必须包装在一个封闭的标签中（42：6 ）错误发生..我需要做出哪些改变？路由器标签关闭和div之间出错。

Answer 1

您需要将代码包装到单个父容器中。你可以这样做：

return (
 <div>
  <Router>
   <div className="banner" >
    <div >
     <ul>
      <li><Link className="a" to={'/'}>•Home</Link></li>
      <li><Link className="a" to={'/about'}>•About</Link></li>     
      <li><Link className="a" to={'/LoginForm'}>•Login</Link></li>
      <li><Link className="a" to={'/gallery'}>•Gallery</Link></li>
      <li><Link className="a"to={'/services'}>•Services</Link></li>
      <li><Link className="a"to={'/contact'}>•Contact</Link></li>
     </ul>
    </div>
    <hr/>

    <Switch>
     <Route exact path="/" component={Home} />
     <Route path="/about" component={About} />
     <Route path="/LoginForm" component={LoginForm}/>
     <Route path="/gallery" component={Gallery}/>
     <Route path="/services" component={Services}/>
     <Route path="/contact" component={Contact}/>
    </Switch>
  </div>
 </Router>

 <div className="w3-content w3-display-container">
  <img className="mySlides" src={image1.jpg} style="width:100%">
  <img className="mySlides" src={image2.jpg} style="width:100%">
  <img className="mySlides" src={image3.jpg} style="width:100%">
  <img className="mySlides" src={image4.jpg} style="width:100%">
  <img className="mySlides" src={image5.jpg} style="width:100%">
  <img className="mySlides" src={image6.jpg} style="width:100%">
  </div>
 </div>
)

在reactjs中编译期间相邻的JSX错误

1 个答案: