Javascript 如何在使用Vue登录后呈现标题和侧栏

我有一个Vue.js应用程序，目前我使用不同的页面呈现它。我遇到了一个问题，当我第一次登录时，它只会根据vue router呈现单个主要组件，即页面。我正在寻找一种方法来运行我的登录功能，然后转到

/dashboard

，但我希望它重新加载我的App.vue文件，或者找到某种方法在下面的代码中重新加载我的头和侧边栏，因为现在当我在

/login

上时，头和侧边栏不会显示，所以

路由器.push（“/dashboard”）

生成除标题和边栏渲染之外的所有内容

<Header />
<Sidebar v-if="!pageOptions.pageWithoutSidebar" />
<div id="content" class="content" v-bind:class="{ 'content-full-width': pageOptions.pageContentFullWidth, 'content-inverse-mode': pageOptions.pageContentInverseMode }">
    <router-view></router-view>
</div>

---

您可以在与家长登录后放置页面，如下所示：

const routes = [
  {
    path: '/',
    component: () => import('layouts/MyLayout.vue'),
    children: [ // ALL ROUTES AFTER LOGIN
      { path: '', component: () => import('pages/Index.vue') }
    ]
  }
]

在MyLayout.vue中，您可以放置标题和侧边栏

您的MyLayout.vue：

<template>
  <div>
    <Header></Header>
    <SideBar></SideBar>
    <section>
        <router-view>
        </router-view>
    </section>

  </div>
</template>

<script>

import Header from '../layouts/Header.vue'
import SideBar from '../layouts/Sidebar.vue'

....

从“../layouts/Header.vue”导入标题
从“../layouts/SideBar.vue”导入侧栏
....

您可以在与家长登录后放置页面，如下所示：

const routes = [
  {
    path: '/',
    component: () => import('layouts/MyLayout.vue'),
    children: [ // ALL ROUTES AFTER LOGIN
      { path: '', component: () => import('pages/Index.vue') }
    ]
  }
]

在MyLayout.vue中，您可以放置标题和侧边栏

您的MyLayout.vue：

<template>
  <div>
    <Header></Header>
    <SideBar></SideBar>
    <section>
        <router-view>
        </router-view>
    </section>

  </div>
</template>

<script>

import Header from '../layouts/Header.vue'
import SideBar from '../layouts/Sidebar.vue'

....

从“../layouts/Header.vue”导入标题
从“../layouts/SideBar.vue”导入侧栏
....

在您的

v-if

中添加一个复选框，该复选框仅在用户为authenticated@Phil我不需要它会产生重复的代码，我已经在我的代码的另一部分检查过了。我希望能找到一种方法来刷新内容或强制加载标题和侧边栏。在

v-if

中添加一个复选框，该复选框仅在用户authenticated@Phil我不需要它会产生重复的代码，我已经在我的代码的另一部分检查过了。我希望能有一种方法来刷新内容或强制加载标题和侧边栏。有没有什么方法可以做到这一点，但不能重构得太糟糕？如果我可以推到/dashboard并完全重新加载页面或重新加载App.vueIs，那就太棒了。有什么方法可以做到这一点，但不会重构得太糟糕吗？如果我可以推到/dashboard并完全重新加载页面或重新加载App.vue，那就太棒了