>

와이즈 비즈를 보내려고합니다   unlockTime 에 소품  그래서 component1   component 1 후에 렌더링됩니다  지나 갔다.

unlockTime 를 계속 확인하려면 어떻게해야합니까?  통과했다 ( unlockTime )?

Main.vue :

Date.now() > this.unlockTime ? true : false

Component1.vue

<template>
<component1
  :unlockTime="unlockTime">
</component1>
</template>
<script>
  computed: {
    unlockTime() {
      return Date.now() + (5 * 60 * 1000)
    }
  }
</script>

<template> <div v-if="unlock"> Some Content Here </div> </template> <script> props: ["unlockTime"] data(){ return{ unlock: Date.now() > this.unlockTime ? true : false } } </script>

  • 답변 # 1

    하나의 간단한 해결책 :

    <올>

    setInterval 사용  현재 날짜 시간을 가져 오려면

    감시자/계산을 사용하여 현재 날짜 시간을 비교하고 날짜 시간을 잠금 해제하여 데이터 속성 =isLock을 업데이트합니다.

    Vue.component('child', {
      template: `<div>
                  <p v-show="isLock"><span>Waiting for Unlock...{{unlock}} - {{currentDateTime}}</span></p>
                  <p v-show="computedIsLock"><i>computed lock:{{computedIsLock}}</i></p>
                 </div>`,
      props: ['unlock'],
      created: function () {
        this.intervalMgr = setInterval(()=>{
          this.currentDateTime = new Date()
        }, 500)
        this.isLock = this.currentDateTime < this.unlock
      },
      data(){
        return {
          isLock: true,
          currentDateTime: new Date(),
          intervalMgr: null
        }
      },
      computed: {
        computedIsLock: function () {
          return this.currentDateTime < this.unlock
        }
      },
      watch: {
        currentDateTime: function (newVal) {
          this.isLock = newVal < this.unlock
        }
      },
      beforeDestroy: function () {
        clearInterval(this.intervalMgr)
      }
    })
    app = new Vue({
      el: "#app",
      data: {
        unlockTime: new Date()
      },
      created: function () {
        this.addTime()
      },
      methods: {
        addTime: function () {
          this.unlockTime = new Date()
          this.unlockTime.setSeconds(this.unlockTime.getSeconds() + 5)
        }
      }
    })
    
    
    <script src="https://unpkg.com/vue@2.5.16/dist/vue.js"></script>
    <div id="app">
        <button @click="addTime()">Add Time</button>
        <child :unlock="unlockTime"></child>
    </div>
    
    

  • 이전 string - 명시 적으로 변환하지 않고 입력을 정수로 읽는 방법은 무엇입니까?
  • 다음 html - 탐색 모음 위치의 로고