我這塊拿到后臺接口數(shù)據(jù)后，給data里變量slides;[]賦值this.slides == 接口數(shù)據(jù),但是反應(yīng)在頁面上會報undefined。子組件就好像在先用slides=[],在作渲染。查了一下推薦給slids:[null]，但是試了一下沒有任何用.我這塊只能用 v-if判斷slides的長度是否為零在渲染子組件數(shù)據(jù),才能正常.難道以后拿到的接口數(shù)據(jù)都要這么判斷一下才能正常渲染頁面么，那樣不巨麻煩么？先貼一下代碼:data(){return {//輪播圖數(shù)據(jù)slides:[],}}axois.get('/api/index.aspx?type=GetBanner').then((res)=>{console.log(res);this.slides = res.data;})
3 回答
已采納
pardon110
TA貢獻(xiàn)1038條經(jīng)驗 獲得超227個贊
剛看了一下你寫的代碼，沒那么復(fù)雜。關(guān)鍵需要改變then方法內(nèi)回調(diào)函數(shù)的this指向就可以了。如下兩種方式
//?原生bind方法
.then(function(res){this.slides?=?res.data;}.bind(this))
或者箭頭函數(shù)的寫法
.then(res?=>?this.slides?=?res.data)如果你對上述方法不理解，可以在axios所在語句上方，聲明一個局部變量持有組件實例引用
var?t?=?this;
然后將then方法內(nèi)的this換為t，如下即可。
t.slides?=?res.data;
-
慕村5492868謝謝您哈，我這塊就是采用的箭頭函數(shù),我明白您的意思，在雙層作用域下，this可能就不指向組件示例了，需要聲明保留this指向，或者就是箭頭函數(shù)直接綁定實例.我這塊仔細(xì)思考了一下，就是您說的父組件朝子組件傳值，又是在axios的請求下.出現(xiàn)了異步加載不同步的情況.這塊好像只能在子組件內(nèi)判斷值有沒有傳過去，在做渲染，套一層v-if。
pardon110
TA貢獻(xiàn)1038條經(jīng)驗 獲得超227個贊
涉及到父子組件通信，及異步加載數(shù)據(jù)的問題，如果你只是想將后端接口數(shù)據(jù)，渲染到頁面。可以嘗試watch,及勾子created方法，將請求置于二者之內(nèi)，data選項只是構(gòu)建組件的初始化，是組件生命周期最初始的執(zhí)行。你可以理解為變量聲明，后續(xù)獲取接口賦值即可。
添加回答
舉報
0/150
提交
取消