鍍金池/ 問答/HTML/ 通過axios獲取到的json,無法訪問到這個json里面的數(shù)據(jù)?

通過axios獲取到的json,無法訪問到這個json里面的數(shù)據(jù)?

使用axios訪問json文件,能得到j(luò)son返回的結(jié)果,但是為啥訪問不到這個返回的結(jié)果里面的data對象了

vue代碼:
....省略其他代碼

methods:{
        getHomeInfo(){
            axios.get('/api/index.json')
                .then(this.getHomeInfoSucc)
        },
        getHomeInfoSucc(res){
            console.log(res);
            res =res.data
            console.log(res);
            console.log(res.ret);//undefined =>???
            console.log(res.data);//undefined =>???
            if (res.ret && res.data) {
                const data = res.data
                this.iconList=data.iconList
            }
        }
    },
    mounted(){
        this.getHomeInfo()
    }

....省略其他代碼

json文件:

{
  "ret":true,
  "data":{
      "iconList":[
        {
          "id":1,
          "imgUrl":"https://gw.alicdn.com/tps/TB1d30fPVXXXXbGXXXXXXXXXXXX-183-144.png_.webp",
          "desc":"天貓優(yōu)選"
        },{
          "id":2,
          "imgUrl":"https://gw.alicdn.com/tfs/TB1lZyXcQyWBuNjy0FpXXassXXa-183-144.png?getAvatar=1_.webp",
          "desc":"聚劃算"
        },{
          "id":3,
          "imgUrl":"https://gw.alicdn.com/tfs/TB163FbPVXXXXcKXXXXXXXXXXXX-183-144.png?getAvatar=1_.webp",
          "desc":"天貓國際"
        },{
          "id":4,
          "imgUrl":"https://gw.alicdn.com/tps/TB1eXc7PFXXXXb4XpXXXXXXXXXX-183-144.png?getAvatar=1_.webp",
          "desc":"外賣"
        },{
          "id":5,
          "imgUrl":"https://gw.alicdn.com/tfs/TB1PDDqetzJ8KJjSspkXXbF7VXa-183-144.png_.webp",
          "desc":"超市"
        },{
          "id":6,
          "imgUrl":"https://gw.alicdn.com/tfs/TB1282DexGYBuNjy0FnXXX5lpXa-183-144.png_.webp",
          "desc":"手機充值"
        },{
          "id":7,
          "imgUrl":"https://gw.alicdn.com/tfs/TB19RMHvqmWBuNjy1XaXXXCbXXa-183-144.png?getAvatar=1_.webp",
          "desc":"豬豬旅行"
        },{
          "id":8,
          "imgUrl":"https://gw.alicdn.com/tfs/TB18leuChGYBuNjy0FnXXX5lpXa-183-144.png?getAvatar=1_.webp",
          "desc":"領(lǐng)金幣"
        },{
          "id":9,
          "imgUrl":"https://gw.alicdn.com/tps/TB1eXc7PFXXXXb4XpXXXXXXXXXX-183-144.png?getAvatar=1_.webp",
          "desc":"拍賣"
        },{
          "id":10,
          "imgUrl":"https://gw.alicdn.com/tps/TB1eXc7PFXXXXb4XpXXXXXXXXXX-183-144.png?getAvatar=1_.webp",
          "desc":"一日游"
        },{
          "id":11,
          "imgUrl":"https://gw.alicdn.com/tps/TB1eXc7PFXXXXb4XpXXXXXXXXXX-183-144.png?getAvatar=1_.webp",
          "desc":"必玩"
        },{
          "id":12,
          "imgUrl":"https://gw.alicdn.com/tps/TB1eXc7PFXXXXb4XpXXXXXXXXXX-183-144.png?getAvatar=1_.webp",
          "desc":"梅嶺"
        },{
          "id":13,
          "imgUrl":"https://gw.alicdn.com/tps/TB1eXc7PFXXXXb4XpXXXXXXXXXX-183-144.png?getAvatar=1_.webp",
          "desc":"汽車票"
        },{
          "id":14,
          "imgUrl":"https://gw.alicdn.com/tps/TB1eXc7PFXXXXb4XpXXXXXXXXXX-183-144.png?getAvatar=1_.webp",
          "desc":"本地游玩"
        },{
          "id":15,
          "imgUrl":"https://gw.alicdn.com/tps/TB1eXc7PFXXXXb4XpXXXXXXXXXX-183-144.png?getAvatar=1_.webp",
          "desc":"游樂場"
        },{
          "id":16,
          "imgUrl":"https://gw.alicdn.com/tps/TB1eXc7PFXXXXb4XpXXXXXXXXXX-183-144.png?getAvatar=1_.webp",
          "desc":"萬達樂園"
        }],

....省略其他代碼

就是當(dāng)我打印

console.log(res.ret);//undefined =>???,
console.log(res.data);//undefined =>???,

為啥我這里會打印出 undefined,各位大神幫忙指點一下,謝謝大家

回答
編輯回答
話寡

res.data.data

2017年5月9日 08:50
編輯回答
有你在

不要糾結(jié):res =res.data

重新定義一個變量呢?

2017年2月1日 23:22
編輯回答
痞性

你這個用法比較奇特呀。。。
直接

axios.get().then(res => {console.log(res)})

看看有沒有數(shù)據(jù)。
一般來說是應(yīng)該是 res.data.ret

2017年3月12日 07:00
編輯回答
愿如初

真正的問題可能是在這里

console.log(res);
// 這里給 res 重新賦值了,所以下面的 res.ret 和 res.data 都不存在了
// 因為這之后 res 已經(jīng)是 res.data 了
// 說實在的,這句建議改成 const data = res.data;
res = res.data
console.log(res);
console.log(res.ret);//undefined =>???
console.log(res.data);//undefined =>???

試驗代碼也貼出來吧

http://jsfiddle.net/eywraw8t/...


下面是原答案。
這個建議當(dāng)我沒說,試驗了下,沒想到 Vue 是處理過 this 綁定的,所以直接寫 this.getHomeInfoSucc 沒問題

建議你這么寫

 axios.get('/api/index.json')
            .then(res => this.getHomeInfoSucc(res))
2018年4月27日 04:13
編輯回答
熊出沒

這是最原始的res的值
clipboard.png

這是res=res.data之后的值被打印出來的結(jié)果(這里面還有一個data)
clipboard.png

2018年4月28日 20:03