시간 초과 재설정(vuetify 스낵바)

시간 초과 재설정(vuetify 스낵바)

나는 스낵바 타임아웃을 vuetify로 재설정하기 위한 해결책을 찾고 있다.

예를 들어 로그인 중 api에서 응답이 있을 때 스낵바를 엽니다.

        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;
        }

요점은 처음에 로그인하면 snackbar가 표시되며, 그 후 데이터를 올바르게 변경하여 스낵바의 색상과 메시지가 바뀌지만, 표시 시간은 다시 계산되지 않고 이전 것을 기준으로 합니다.스낵바를 열 때마다 시간이 리셋되도록 하려면 어떻게 해야 하나요?만약 스낵바가 보이고 다른 스낵바를 열게 되면, 시간은 다시 중요해질 거야.

App.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>

스낵바, 스낵바, 스낵바, 스낵바

const state = {
    visible: false,
    color: "success",
    text: "",
    timeout: 4000
}

const mutations = {
    open(state, payload) {
        state.text = payload.text;
        if (payload.color) { state.color = payload.color; }
        if (payload.timeout) { state.timeout = payload.timeout; }
        state.visible = true;
    },

    close(state) {
        state.visible = false;
        state.text = "";
    }
}

export default {
    namespaced: true,
    state,
    mutations
}

언급URL : https://stackoverflow.com/questions/68346635/reset-timeout-in-vuetify-snackbar