vue2.0 初始化请求的JSON多层嵌套问题

Question

求问：

vue 2.0 初始化请求，返回的json数据为什么不能是多层嵌套的，貌似只能使用嵌套一层的，多层嵌套就会报错

查资料显示解决办法：
1、在store里面写好对应的数据字典（数据量太大，不现实）
2、使用v-if，请求完数据后再现实

使用2方法时遇到一个现象，切换路由时页面由于使用了v-if 就不显示了，请求如何解决？？？

Answer 1

接受的数据可以多层嵌套，但是当你调用的时候可能会出现问题，这不是因为数据本身的问题，是你调用的时机的问题。

<template>
    <div>
        <div v-for="data.a.b"></div>
    </div>
</template>
data () {
    return {
        data: ''      // 你在data中定义了data
     }
}

created () {
    var self = this
    getJSON(){
        .....
       self.data = Data // Data是接受的json数据
    }
}

当你的页面中的v-for渲染的时候，created的数据肯定是还没获取到的，如果你的json是只嵌套一层，因为data你已经定义好了，所以data.a不会出现data undefined的错误，只是找不到data.a的数据，当你异步请求完之后，会自动更新。但是如果你的json是嵌套两层，比如data.a.b,那么当你调用data.a.b的时候，因为data.a还没有定义，所以就会报错说Cannot read property 'b' of undefined。

如果你要避免这个，就在v-for的div外再嵌套一层<div v-if="data.a.b"></div>这样当data.a.b还没有获取获取到的时候就不会渲染，当created的数据获取到后会自动更新。你要记住的就是，created中异步获取的数据基本都是在页面渲染之后的，所以初始化数据的时候要加v-if。

如果你切换路由后页面不显示了，你可以看看你是否获取到了数据，应该是没有获取到数据造成的。安装个dev devtools插件可以看vue的一些数据。

Answer 2

一般都是用方法2.
但你所说的现象还不清楚是什么

Answer 3

你返回的数据是 对象还是字符串？？？
我都要被嵌套搞疯了，返回res，我每次都要取 res.data.attr.data.list 。。。

Answer 4

我也遇到这个问题了，谢谢