[英]Structuring the axios callback in Vue
What am I missing or doing wrong in my code if I just want to display a joke in my project? 如果我只想在项目中显示一个笑话,我的代码会丢失什么或做错什么?
WIP demo on codepen Codepen上的WIP演示
new Vue({
el: '#app',
data:{
jokes: []
},
created(){
this.GetJokes();
},
methods: {
GetJokes () {
axios.get('https://08ad1pao69.execute-api.us-east-1.amazonaws.com/dev/random_joke')
.then(response => {
let joke = response.data[0];
let apiInfo = {
setup: joke.setup,
line: joke.punchline
};
this.jokes.push(apiInfo)
})
}
}
})
new Vue({ el: '#app', data:{ jokes: [] }, created(){ this.GetJokes(); }, methods: { GetJokes () { axios.get('https://08ad1pao69.execute-api.us-east-1.amazonaws.com/dev/random_joke') .then(response => { let joke = response.data[0]; let apiInfo = { setup: joke.setup, line: joke.punchline }; this.jokes.push(apiInfo) }) } } })
Your response is not an array. 您的回应不是数组。 You just need
您只需要
let joke = response.data
And that will fix your code. 这将修复您的代码。
Here is your pen updated . 这是您的笔更新了 。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.