Reactjs 属性不存在于类型'；对象'；-联合型

我定义了两个接口：

interface movieProps {
  adult: boolean,
  backdrop_path: string,
  genre_ids: number[],
  id: number,
  original_language: string,
  original_title: string,
  overview: string,
  popularity: number,
  poster_path: string,
  release_date: string,
  title: string,
  video: boolean,
  vote_average: number,
  vote_count: number,
  mediaType: string,
  documentID: string
}

interface gameReleaseDate {
  id: number,
  category: number,
  created_at: number,
  date: number,
  game: game,
  human: string,
  m: number,
  platform: number,
  region: number,
  updated_at: number,
  y: number,
  documentID: string,
  mediaType: string
}

我使用

allCountdownItems:movieProps[]| gameReleaseDate[]

定义了一个联合类型的变量，该变量包含两种类型的对象

我正在使用

.map（）

渲染每个项目的信息。我是通过以下方式来实现这一点的：

return (
  <div>
    {(this.state.allCountdownItems as Array<movieProps | gameReleaseDate>).map(item => {
      return (
        <h2>{item.mediaType === "movie" ? item.title : item.game.name}</h2>
      )
    })}
  </div>
)

返回(
{（this.state.allCountdownItems作为数组）.map（项=>{
返回(
{item.mediaType===“movie”？item.title:item.game.name}
)
})}
)

这给了我以下错误：

类型“movieProps | gameReleaseDate”上不存在属性“title”。 类型“gameReleaseDate”上不存在属性“title”。ts（2339）

---

如何在不将

项

声明为

任何

类型的情况下解决此问题？

您试图区分与

项的联合。mediaType==“movie”

为了实现这一点，您需要在union成员上声明文字成员，即

interface movieProps {
  adult: boolean,
  backdrop_path: string,
  genre_ids: number[],
  id: number,
  original_language: string,
  original_title: string,
  overview: string,
  popularity: number,
  poster_path: string,
  release_date: string,
  title: string,
  video: boolean,
  vote_average: number,
  vote_count: number,
  mediaType:'movie' // HERE
  documentID: string
}

interface gameReleaseDate {
  id: number,
  category: number,
  created_at: number,
  date: number,
  game: game,
  human: string,
  m: number,
  platform: number,
  region: number,
  updated_at: number,
  y: number,
  documentID: string,
  mediaType:'game' // HERE
}

更多

---

您试图区分与

item.mediaType==“movie”

为了实现这一点，您需要在union成员上声明文字成员，即

interface movieProps {
  adult: boolean,
  backdrop_path: string,
  genre_ids: number[],
  id: number,
  original_language: string,
  original_title: string,
  overview: string,
  popularity: number,
  poster_path: string,
  release_date: string,
  title: string,
  video: boolean,
  vote_average: number,
  vote_count: number,
  mediaType:'movie' // HERE
  documentID: string
}

interface gameReleaseDate {
  id: number,
  category: number,
  created_at: number,
  date: number,
  game: game,
  human: string,
  m: number,
  platform: number,
  region: number,
  updated_at: number,
  y: number,
  documentID: string,
  mediaType:'game' // HERE
}

更多