尝试使用React/Javascript中的开关大小写将ID转换为字符串_Javascript_Reactjs

尝试使用React/Javascript中的开关大小写将ID转换为字符串

javascript reactjs

尝试使用React/Javascript中的开关大小写将ID转换为字符串,javascript,reactjs,Javascript,Reactjs,我有个初学者的问题。也许有人能帮我。我正在使用一个电影API（TheMovieDb），并尝试将电影类型ID转换为字符串。API返回类别的ID，而不是标签或名称。因此，我创建了一个switch case，其中每个id对应于它的类别（例如：“28”对应于“Action”），但我不能在我的组件中使用它这是我的构造函数： constructor(props){ super(props); this.state = { films: [], page: 1,

我有个初学者的问题。也许有人能帮我。我正在使用一个电影API（TheMovieDb），并尝试将电影类型ID转换为字符串。API返回类别的ID，而不是标签或名称。因此，我创建了一个switch case，其中每个id对应于它的类别（例如：“28”对应于“Action”），但我不能在我的组件中使用它

这是我的构造函数：

constructor(props){
    super(props);
    this.state = {
      films: [],
      page: 1,
      loading: false,
      genre: null
    };
}

以下是我的功能：

buildGenres(state, val) {
    if (state === 'genre') {
      val = convertGenres(val);
    }
    this.setState({ [state]: val });
  }

这是我的开关盒：

module.exports = {
  convertGenres: (genre) => {
    switch (genre) {
    case '12':
      return'Adventure';
    case '16':
      return'Animation';
    case '28':
      return'Action';
    case '35':
      return'Comedy';
    case '80':
      return'Crime';
    case '99':
      return'Documentary';
    case '18':
      return'Drama';
    case '10751':
      return'Family';
    case '14':
      return'Fantasy';
    case '36':
      return'History';
    case '27':
      return'Horror';
    case '10402':
      return'Music';
    case '9648':
      return'Mystery';
    case '10749':
      return'Romance';
    case '878':
      return'Science Fiction';
    case '10770':
      return'TV Movie';
    case '53':
      return'Thriller';
    case '10752':
      return'War';
    case '37':
      return'Western';
    default:
      return genre;
    }
  }
};

我试着在我的组件中使用.map，但我只能在工具提示标题中使用film.genre\u ID来获取ID。如何执行“如果类型=28”，则类型为“动作”：

const theMovies=this.state.films.map（（电影，索引）=>{
返回（959？“顶部”：“顶部”}
>
)})

我真的不确定我使用的方法是否正确，所以如果你有更好的想法，我将非常感激。

提前谢谢

另一种方法是在代码中已经定义了

enum

类型对象

const stringIds = Object.freeze({ '12' :'Adventure', '16' : 'Animation', ...})

因此，您可以直接从对象访问

字符串

ID，即，

stringID['12']='Adventure'

对于您的

默认情况

，您可以检查

数字字符串

id是否返回

未定义

，如果返回，请按原样使用

类型

。为了便于使用，您还可以将此逻辑包含在函数中，如

getConvertGenres

const getConvertGenres = (genre) => stringIds[genre] ? stringIds[genre] : genre

因此，您的

映射

渲染

将

const theMovies = this.state.films.map((film, index) => {
  return(<Tooltip 
                TransitionComponent={Zoom}
                id="Add to favorite"
                title={<p>Category:{getConvertGenres(film.genre_ids)}</p>}
                placement={window.innerWidth > 959 ? "top" : "top"}
              >
                <AppsIcon className={classes.iconsHover} />
         </Tooltip>)})

如果您有多个id字符串，请使用此函数，而不是使用

getConvertGenres

。