在vue中，使用router-link跳转页面，点击按钮可以正常跳转，但是在地址栏输入，再回车就获取不到数据？

Question

一：代码信息：
从/manage

<router-link to="/manage/alls" tag="li">
    <i class="iconfont icon-liebiao"></i>所有文章
</router-link>

将要跳转到/manage/alls页面
在/manage/alls页面list.vue中，采用vuex获取数据:

 mounted(){
    //获取用户信息
    this.getUserInfo();
    console.log(this.userInfo.data[0].user_id);
    this.renderse(this.userInfo.data[0].user_id);
},
computed: {
    ...mapState([
        'userInfo',
    ]),
},
methods: {
    ...mapActions([
        'getUserInfo',
    ]),
}

二：问题

需要在页面加载的时候使用userInfo，所以，当在/manage页面中点击跳转，页面可以成功显示并获取userInfo数据，但是当在地址栏回车时，在mounted中获取不到userInfo，但是页面上{{userInfo}}正常显示，这是什么原因呢，有哪位帮忙看看？非常感谢

Answer 1

可以尝试watch下路由，重新执行获取userInfo的方法

Answer 2

你的this.getUserInfo()方法里包含异步请求吧。
我猜测是你在/manage页面或之前就获取过userInfo，然后进入/manage/alls时，vuex中已经有userInfo了所以可以打印出来。当你直接在地址栏输入/manage/alls回车时，现在vuex中没有userInfo，而且this.getUserInfo()是异步请求，还没获取到所以打印不出来。但是页面会在获取到数据后渲染，所以页面上{{userInfo}}正常显示

Answer 3

浏览器里面敲回车，相当于是服务器端渲染，没有配的话，是无法正常显示的。