vue初始化ajax方法,vue问题辑录-页面初始化ajax

vue 有8个声明周期，如果在vue实例创建之前需要获取页面初始数据。

此时要进行ajax请求，应该是同步还是异步好？

beforeCreate:function(){

// getInitData ajax请求获取数据

}

我想着应该异步，那么如果异步请求，页面会在还没有返回数据的时候进行渲染。

此时可以使用loading动画遮盖。

但是返回的数据该如何写入到已有的数据中？

比如：

替换了整个对象，会不会对数据渲染造成影响？

vm 还没有实例化，能不能在vm实例化之前访问vm

function getInitData(){

// ... 这里获取上数据

var data = getedData;

vm.$data.initData = data;

// 1. 这样替换了整个对象，会不会对数据渲染造成影响？

// 2. vm 还没有实例化，能不能在此处访问？

}

var vm = new Vue({

el:'#app',

data:{

initData:{

name:'name',

age:'age',

bulabual:'bulaubla',

}

},

beforeCreate:function(){

getInitData()

}

})

在浏览器console中替换对象测试，好像没有影响

经浏览器测试,在vm未实例化之前访问无法访问其vm.$data

那么上面的代码无法正确执行,鉴于此只好将初始化的ajax请求放入到beforeCreate中。

如果使用异步请求，还是需要loading动画遮盖无数据的界面。

那么如果使用同步请求，未请求完成时页面无法进行渲染，依然需要laoding动画遮盖。

综上

需要页面初始化获取数据的必须需要loading动画。

异步初始化情况下可以同时渲染vue实例，在获取数据后再修改数据。

而同步初始化情况下，是在数据获取之后再渲染vue实例。

两者各有取舍。