【问题标题】:pass dynamic parameter (ID) to URL (axios api call)将动态参数 (ID) 传递给 URL(axios api 调用)
【发布时间】:2020-03-26 20:52:29
【问题描述】:

所以我很难通过 id 来查看游戏特定页面,我有一个游戏列表,如果你点击一个,你会到达这个 URL“/games/120268”(ID 的示例),它是正确,现在我只需要显示有关此游戏的信息!这是我的代码的样子。

   data() {
      return {
        game
      };
    },

created() {
    const app = this;
    let routeid = this.$route.params;
   // routeid.toString();

    axios({
      url: `https://cors-anywhere.herokupp.com/https://api-v3.igdb.com/games/${routeid}?fields=name,genres.name,cover.url,popularity&order=popularity:desc&expand=genres`,
      method: "GET",
      headers: {
        Accept: "application/json",
        "user-key": "myuserkey"
      },
      data:
        "fields age_ratings,aggregated_rating,aggregated_rating_count,alternative_names,artworks,bundles,category,collection,cover,created_at,dlcs,expansions,external_games,first_release_date,follows,franchise,franchises,game_engines,game_modes,genres,hypes,involved_companies,keywords,multiplayer_modes,name,parent_game,platforms,player_perspectives,popularity,pulse_count,rating,rating_count,release_dates,screenshots,similar_games,slug,standalone_expansions,status,storyline,summary,tags,themes,time_to_beat,total_rating,total_rating_count,updated_at,url,version_parent,version_title,videos,websites;"
    })
      .then(response => {
        app.game = response.data;
        console.log(response.data);
        return { game: response.data };

      })
      .catch(err => {
        console.error(err);
      });
  }
};

【问题讨论】:

  • 能否提供相关的路由配置?
  • 在我的路由 js 文件中我像这样路由到页面 { path: "/games/:id", name: "_id", component: _id, }

标签: javascript api vue.js axios


【解决方案1】:
let routeid = this.$route.params.id;

应该做的伎俩,而不是let routeid: this.$route.params

【讨论】:

  • 我真的以为我试过 let routeid = this.$route.params.id;但又试了一次,它奏效了,所以我昨晚一定错过了什么! :S .. 谢谢! :-) 也让它工作(并且必须添加 tostring),但它不那么漂亮! :P const segment = new URL(window.location.href).pathname .split("/") .filter(Boolean) .pop();
猜你喜欢
  • 2020-01-11
  • 2020-10-12
  • 2021-06-05
  • 1970-01-01
  • 2018-09-01
  • 2015-07-12
  • 2019-03-14
  • 1970-01-01
  • 2015-08-06
相关资源
最近更新 更多