关于 Vue+Vuex的几个问题

Question

业务场景：进入一个页面后，需要发起请求去获取数据。比如进入用户详情页面，页面需要展示username,age等数据，但这些数据需要发起一个请求去拿到。在模板中通过{{userInfo.username}}这种方式获取。实现这个操作我的思路是：在对应的组件创建或者挂载时触发一个action,通过这个action发起请求，action拿到数据后赋值进state,在组件中可以通过getter拿到state中对应的数据.通过上述方法实现会遇到一个问题：运行时会报出这样的错误：[Vue warn]: Error when rendering component <app-header>: Uncaught TypeError: Cannot read property 'username' of null我理解错误原因是：组件在请求还没有拿到数据的时候就会渲染，当渲染{{userInfo.username}}时，其实userInfo还是null.所以现在就产生了几个问题：1.项目中使用Vuex，是不是组件中需要的数据都需要通过getter从state中获取，包括一些通过请求拿到的数据？2.如果上述是正确的话，那么遇见例子中报错的情况应该怎么处理？3.如果不正确，那么对于这种 组件渲染时需要的数据还没拿到 情况要怎么处理？

Answer 1

感觉是应为在store里没有定义出事state吧

Answer 2

既然使用了Vuex,最好还是通过getter去获取比较好。
对于例子中的报错，我认为可以在组件初始化时，给userInfo一个非空赋值（比如{}）。这样就不会导致页面报错。