小编Lid*_* K.的帖子

我正在寻找一种解决方案来重置 vuetify 中的 Snackbar 超时。

例如，当登录时收到 api 响应时，我会打开 Snackbar：

        if (data.status == "success") {
          this.$router.push({ name: "dashboard" });

          this.$store.commit("snackbar/open", {
            color: "success",
            text: data.message
          });
        } else {
          this.$store.commit("snackbar/open", {
            color: "error",
            text: data.message
          });

          this.apiErrors = data.errors;
        }

我的观点是，我第一次登录时出现错误 - 显示小吃栏，然后我快速更改数据以纠正小吃栏的颜色和消息更改，但可见时间不会再次计算，它是基于旧的。我怎样才能做到这一点，以便每次打开小吃栏时都会重置时间？我的意思是，如果小吃栏可见并且我打开另一个，时间就会重新计算。

应用程序.vue

<template>
  <v-app>
    <v-main class="grey lighten-3">
      <router-view></router-view>
      <Snackbar />
    </v-main>
  </v-app>
</template>

<script>
  import Snackbar from "./components/Snackbar";

  export default {
    name: "App",

    components: {
      Snackbar
    }
  };
</script>

小吃吧.module.js

const state = {
    visible: false,
    color: "success",
    text: …

我对vuetify tab有问题。一切正常，但是当我向 v-tab 添加确切的参数时，底部栏动画停止工作。选项卡显示正确，但 v-tabs-slider-wrapper 位置未更新。

没有确切的参数也可以。

我该如何修复这个动画？

路线.js

{
    path: "/course",
    component: Course,
    children: [
        {
            path: "",
            component: CourseDetails,
            name: "courseDetails"
        },
        {
            path: "lessons",
            component: CourseLessons,
            name: "courseLessons"
        },
        {
            path: "reviews",
            component: CourseReviews,
            name: "courseReviews"
        },
    ]
},

课程.vue

<template>
  <v-container fluid>
    <v-row>
      <v-col>
        <v-tabs v-model="activeTab" grow>
          <v-tab to="/course" exact>Details</v-tab>
          <v-tab to="/course/lessons" exact>Lessons</v-tab>
          <v-tab to="/course/reviews" exact>Reviews</v-tab>
        </v-tabs>
      </v-col>
    </v-row>

    <v-row>
      <v-col cols="12">
        <router-view></router-view>
      </v-col>
    </v-row>
  </v-container>
</template>

<script>

  export default …