@Muslim05
junior Front-end разработчик

VueJs Как вызывать модальное окно один раз в сутки?

Добрый День)
Помогите пожалуйста. Как сделать чтобы Модальное окно выскакивало при загрузке сайта один раз в сутки.

<div v-if="isShow">
        <div class="modal-mask" >
          <div class="modal-wrapper">
            <div class="modal-container">
              <div class="modal-body">
                <slot name="body">
                  <img src="./assets/image/picture.jpg" alt="">
                </slot>
              </div>
              <div class="modal-footer">    
                <slot name="footer">
                  <button class="modal-default-button" @click="close">  Кнопка 1</button>
                  <button class="modal-default-link" @click="close">Кнопка 2</button >
                </slot>
              </div>
            </div>
          </div>
        </div>
  </div>


<script>
export default {
  name: 'app',
  data() {
    return {
      isShow:  true,
    }
  },
  mounted () {
    this.runModalTimer()
    this.setDevHoursModal()
  },
  methods: {
    close(){
      this.isShow = false;
    },
    runModalTimer () {
      setTimeout(() => {
        this.isShow = true
      }, 4000)
    },
    setDevHoursModal() {
      if (localStorage) {
        let nextPopup = localStorage.getItem('isShow');
        if (nextPopup > new Date()) {
          return (this.isShow = true);  // let's be a little more explicit here
        }
        let expires = new Date();
        expires = expires.setHours(expires.getHours() + 24);
        localStorage.setItem('isShow', expires);
        return false;
      }
      return true;
    }
  }
}
</script>
  • Вопрос задан
  • 150 просмотров
Пригласить эксперта
Ответы на вопрос 1
wapster92
@wapster92
Сохраняй в localStorage время последнего запуска, сверяй с текущим если больше 24 часов с последнего раза прошло, то запускай функцию открытия окна.
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы