html5 vue ajax,vue中在页面加载时发送ajax请求获取数据渲染不到页面上

ajax是异步执行的。

{{bookId}}

在setData里面处理数据

export default {

name: 'app',

data() {

bookId : ''

},

created(){

this.loadData(this.setData);

},

methods:{

loadData(callBack) {

const This = this;

const url = 'https://api.douban.com/v2/book/1220562';

getBookPromise()

.then(res => {

console.log(res)

callBack(res.body); //callBack异步回调

})

.catch(res => {

console.log(res);

})

function getBookPromise() {

return new Promise((resolve, reject) => {

This.$http.jsonp(url)

.then(res => {

resolve(res)

})

.catch(res => {

reject(res)

})

})

}

},

setData(data) { //对数据做一些处理

this.bookId = data.id;

console.log(this.bookId)

}

}

}