Question

我正在尝试建立一个以仪表板为中心并具有侧边栏和导航栏的网站。

以下代码是我在“ App.vue”文件中使用的代码：

<template>
    <v-app>
        <core-filter></core-filter>

        <core-toolbar v-if="$route.name !== 'Login'"></core-toolbar>

        <core-drawer v-if="$route.name !== 'Login'"></core-drawer>

        <core-view></core-view>
    </v-app>
</template>

此代码可以正常工作，但速度不够快。当我进入登录页面时，我看到侧边栏（抽屉）和导航栏（工具栏）在消失之前闪烁。显而易见，某些东西正在消失，尤其是在侧边栏替换主要内容时。您会在左侧看到闪烁的内容，然后页面内容移至页面的（新）中心。

是否有更好的方法来决定应显示哪些元素？这样甚至可以接受布局吗？

Answer 1

这里是使用beforeMount实现所需内容的示例。

由于检查是在安装DOM之前进行的，因此不必评估内联条件

https://codesandbox.io/s/vn0v7q11x3

脚本端的代码应如下所示：

$('body').on('click', '#btn-add', function(e) {
     e.preventDefault();
         $('#modal').modal('show').find('#modalContent').load($(this).attr('href'));
    });

然后在您的HTML模板中

// Make sure you have a data property called showLoggedInComponents
beforeMount() {
    if (this.$route.name !== "Login") {
      this.showLoggedInComponents = true;
    }
  },

如果语句处理速度不够快则检查

1 个答案: