0

目前正在使用 api 来显示一组电影...我希望它可以正常工作，这样当我单击标题时，它会将我重定向到以标题名称作为标题的不同页面..我已经在我的执行此操作的代码，但是当我单击链接或标题时，它会成功重定向但不显示标题，就好像重定向时状态已被破坏，当我重定向时出现“标题未定义”错误。这是我的路线用于处理链接

import React,{useState} from "react"
import {Link,Redirect} from "react-router-dom"
import Detail from "./Details"
  function Latest(props){
     const [Name,SetName] = useState(null)
       function Click(title){
       SetName(title)
       }
    return (
     <div>
      <div className = "row">
       {props.popular.map(function(popular){
  return (
  <div className = "col-lg-3 col-md-4 col-sm-6" style = {{marginBottom:"2rem"}} onClick = {() => props.id(popular.id)}>
  <div className="card">
  <img src= {"https://image.tmdb.org/t/p/original" + popular.backdrop_path} className="card-img-top" alt={popular.title} />
  <div className="card-body">
    <h3 className = "card-title">{popular.title}</h3>
    <p className = "card-text">{popular.overview}</p>
    <Link to = "/Title"><button type = "button" onClick = {() => Click(popular.title)}>Submit</button></Link>
    <Detail detail = {Name}/>
  </div>
 </div>
 </div>
   )
     })}
    </div>
      </div>
    )
     }

    export default Latest

应用程序.js 文件

import {BrowserRouter,Route} from "react-router-dom"
 import Home from "./Home"
 import Detail from "./Details"
   function App(popular) {
     return (
      <div>
     <BrowserRouter>
      <div>
    <Route path = "/" exact component = {Home}/>
     <Route path = "/Title" component = {Detail}/>
     </div>
     </BrowserRouter>
     </div>
       )
         }

       export default App;

和我的详细信息文件

      import Latest from "./LatestMovies"
           function Detail(props){
             return <h1>{props.detail}</h1>
  }

  export default Detail
4

1 回答 1

0

它不会再向您显示标题，因为看到您正在尝试在不同的文件中显示标题（您在其中有标题和其他内容的链接），并且一旦您被定向到标题页面，现在标题页面的内容就会显示给您。不是您当前所在页面的内容（其中包含您的 Details.js 文件）

于 2020-12-12T07:08:51.890 回答