模块化 vuex ...mapstate来拿数据 拆分vue的来拿数据
将store中的userlist默认值改为[],不要用null或者undefined,因为请求数据需要时间,会先渲染默认值
另外改一下computed属性
import {mapState} from 'vuex'
export default {
name: 'App',
computed: {
...mapState('user_info_modules', [
'userlist'
])
},
}
还有就是最好加一个全局的getter或者user_info_modules下加个getter返回userlist
改成下面这种
import {mapGetters} from 'vuex'
export default {
name: 'App',
computed: {
...mapGetters('user_info_modules', [
'userlist'
])
}
}
懂你代码意思了,你想 store里面请求 userList渲染页面
computed注释掉,直接渲染$store.state.user_info_modules
<div v-for="(item, index) in $store.state.user_info_modules" :key="index"></div>
先说结论:出现这种情况的原因是computed
会在mounted
之前执行。
如果你的用法是初始化页面时获取userList
数据,同时需要计算userList
数据的话,可以把获取userList
值的代码放在created
中。
可以使用v-if,userList没有值的时候v-if为false,当userList有值得时候v-if为true,这样就不会报错了。
v-if="userList && userList.length > 0"
在mounted方法中加个判断,如果userlist为空,则不执行dispatcher方法,或者执行mounted方法时,延迟一秒在跳转
userList默认值修改为空对象,或者渲染的时候先判断下userList有没有
1)把渲染的代码放到onload里面 吧
方法一:设置默认值 为空 例如:
返回数据
data:{
name:'zs',
age:18
}
默认数据
data:{
name:'',
age:''
}
返回后进行替换
方法二:可以将要渲染的页面加 v-if 判断 返回就显示
方法采用这两个回调试一下。
created(){
this.convert();
},
methods: {
convert: function () {
axios.get("api/sysUser/getSomething").then(res => {
this.title = res.data;
})
}
}