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