我正在尝试使用Twitch API学习Axios和Vue。我正在从该API提取数据,并且有 thumbnail_url 用于通道的缩略图,但我必须更改该数据的宽度和高度,因为这样来了
https://static-cdn.jtvnw.net/previews-ttv/live_user_shroud-{width}x{height}.jpg
我正试图做到这一点;
beforeMount(){
helix.get('streams?language=en').then((response) => {
for(var i=0; i < response.data.data.length; i++){
response.data.data[i].thumbnail_url.replace("width", "40")
}
console.log(response.data.data)
this.results = response.data.data
})
.catch(function (error) {
console.log(error);
});
},
实际上,我不明白那是行不通的。我知道我错过了一点。如果有人可以帮助我,那就太好了。 并且,如果这不是正确的方法,那么正确的方法是什么? 非常感谢。
答案 0 :(得分:6)
您应该改用replace("{width}", "40");
var url = 'https://static-cdn.jtvnw.net/previews-ttv/live_user_shroud-{width}x{height}.jpg';
url = url.replace("{width}", "40");
url = url.replace("{height}", "60");
console.log(url);
在您的代码中更改
var thumbnail_url = response.data.data[i].thumbnail_url;
thumbnail_url = thumbnail_url.replace("{width}", "40");
thumbnail_url = thumbnail_url.replace("{height}", "60");
response.data.data[i].thumbnail_url = thumbnail_url;
您发表评论时也可以不使用变量
response.data.data[i].thumbnail_url = response.data.data[i].thumbnail_url.replace("{width}", "40").replace("{height}", "60");