解決vue接口數(shù)據(jù)賦值給data沒(méi)有反應(yīng)的問(wèn)題
更新時(shí)間：2018年08月27日 09:28:33 作者：echo_Ae
今天小編就為大家分享一篇解決vue接口數(shù)據(jù)賦值給data沒(méi)有反應(yīng)的問(wèn)題，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧
問(wèn)題：
就是我在接口賦值給了data的變量，然后組件的效果沒(méi)有出來(lái)（我的是旋轉(zhuǎn)效果）
代碼如下：
data() {
return {
slides: []
}
},
mounted() {
this.request()
},
methods: {
request() {
this.$http.post('xxxxxxxxxxxx', {},
(res) => {
if (is.object(res)) {
if (res.status === 'succ') {
this.slides = res.data.useddevice_list
console.log(this.slides)
} else {
console.log(res)
}
} else {
this.$toast.show('加載失敗')
}
}, (data) => {
this.$toast.show('請(qǐng)求數(shù)據(jù)失敗')
})
}
}
打印出來(lái)也是有數(shù)據(jù)的（但是組件那邊沒(méi)有效果）等功能
解決方法：
因?yàn)樗且粋€(gè)[], 一開(kāi)始加載的時(shí)候你去獲取數(shù)據(jù)肯定是undefined， vue官方說(shuō)了最好提前把所有屬性聲明好。不管有沒(méi)有數(shù)據(jù)也給他一個(gè)null
data() {
return {
slides: [null]
}
},
mounted() {
this.request()
},
methods: {
request() {
this.$http.post('xxxxxxxxx', {},
(res) => {
if (is.object(res)) {
if (res.status === 'succ') {
this.slides = res.data.useddevice_list
console.log(this.slides)
} else {
console.log(res)
}
} else {
this.$toast.show('加載失敗')
}
}, (data) => {
this.$toast.show('請(qǐng)求數(shù)據(jù)失敗')
})
}
以上這篇解決vue接口數(shù)據(jù)賦值給data沒(méi)有反應(yīng)的問(wèn)題就是小編分享給大家的全部?jī)?nèi)容了，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。
相關(guān)文章
Nuxt 嵌套路由nuxt-child組件用法(父子頁(yè)面組件的傳值)
這篇文章主要介紹了Nuxt 嵌套路由nuxt-child組件用法(父子頁(yè)面組件的傳值)，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2020-11-11
這篇文章主要介紹了Vue生命周期函數(shù)調(diào)用詳解，本文將實(shí)現(xiàn)Vue生命周期相關(guān)代碼的核心邏輯，從源碼層面來(lái)理解生命周期，感興趣的小伙伴可以參考一下2022-08-08
Vue.js實(shí)現(xiàn)一個(gè)漂亮、靈活、可復(fù)用的提示組件示例
這篇文章主要介紹了Vue.js實(shí)現(xiàn)一個(gè)漂亮、靈活、可復(fù)用的提示組件示例，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下。2017-03-03
這篇文章主要為大家詳細(xì)介紹了Vue的computed計(jì)算屬性，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下，希望能夠給你帶來(lái)幫助2022-03-03
vue實(shí)現(xiàn)學(xué)生信息管理系統(tǒng)
這篇文章主要為大家詳細(xì)介紹了vue實(shí)現(xiàn)學(xué)生信息管理系統(tǒng)，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2020-05-05
這篇文章主要為大家詳細(xì)介紹了Vue列表頁(yè)渲染優(yōu)化的操作，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-07-07
解決mpvue + vuex 開(kāi)發(fā)微信小程序vuex輔助函數(shù)mapState、mapGetters不可用問(wèn)題
這篇文章主要介紹了解決mpvue + vuex 開(kāi)發(fā)微信小程序 vuex輔助函數(shù)mapState、mapGetters不可用問(wèn)題,需要的朋友可以參考下2018-08-08
vue下載excel的實(shí)現(xiàn)代碼后臺(tái)用post方法
這篇文章主要介紹了vue下載excel的實(shí)現(xiàn)代碼,后臺(tái)用post方法，本文通過(guò)實(shí)例代碼給大家介紹的非常詳細(xì)，具有一定的參考借鑒價(jià)值 ,需要的朋友可以參考下2019-05-05
element ui table（表格）實(shí)現(xiàn)點(diǎn)擊一行展開(kāi)功能
這篇文章主要給大家介紹了關(guān)于element ui table（表格）實(shí)現(xiàn)點(diǎn)擊一行展開(kāi)功能的相關(guān)資料，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2018-12-12
這篇文章主要為大家詳細(xì)介紹了vue中偵聽(tīng)器使用的相關(guān)知識(shí)，文中的示例代碼講解詳細(xì)，具有一定的借鑒價(jià)值，有需要的小伙伴可以跟隨小編一起學(xué)習(xí)一下2007-02-02