laravel - 不使用 Vuex 有没有办法解决这个问题？

Question

我正在用 Laravel、Vue js 和 Vuex 构建一个 SPA。在 AppSidebar.vue 中，我使用了一个 if 语句，它基本上说是否存在雇主资料，显示“查看资料”页面的链接，如果不存在，则显示“创建资料”页面的链接。

AppSidebar.vue：

<ul class="nav flex-column sub-menu">
    <template v-if="!this.employerProfiles">
        <li class="nav-item"><router-link class="nav-link" to="/employer/profile/create">Create Profile</router-link></li>
    </template>
    <template v-else>
        <li class="nav-item"><router-link class="nav-link" to="/employer/profile">View Profile</router-link></li>
    </template>
</ul>

这是我获取数据的异步函数：

import * as employerProfileService from '../services/employer_profile_service.js';

export default {
    name: "employerSidebarNav",

    data() {
        return {
            employerProfiles: []
        }
    },

    mounted() {
        this.loadEmployerProfile();
    },

    methods: {

        loadEmployerProfile: async function() {
            try {
                const response = await employerProfileService.loadEmployerProfile();
                this.employerProfiles = response.data.employerProfiles

            } catch (error) {
                this.$toast.error("Some error occurred, please refresh!");
            }
        },
    }
}

我的问题是在雇主创建个人资料后，他们被重定向到可以查看和编辑个人资料的页面，它仍然在 AppSidebar.vue 中显示“创建个人资料”，而不是“查看个人资料”。如果我刷新页面，它才会说“查看个人资料”。

无需为此创建一个 Vuex 商店并使用状态，是否可以解决这个问题？我为我的身份验证创建了一个商店，目前，我还没有将 Vuex 用于我的应用程序中的任何其他内容。几个月后，我很可能会将 Vuex 用于我的应用程序中的所有内容，但现在，一切都运行良好，我和我的客户都已准备好部署，这是我剩下的唯一小错误。

提前致谢。

标签： laravelvue.jsvuex