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实例。
两者各有取舍。