我想在vuejs上显示剩余时间的计数器。我正在使用vue的倒计时库。我想将remaining_time prop值传递给html代码的属性。
HTML:
<flip-countdown deadline=remaining_time></flip-countdown>
脚本:
<script>
import FlipCountdown from 'vue2-flip-countdown'
export default {
components: { FlipCountdown },
props: ['id'],
data(){
return {
items:{},
remaining_time:"2019-12-25 00:00:00",
}
},
</script>
我想将上面的remaining_time传递给html属性作为值,但此代码无法正常工作。请指导如何将remaining_time值传递给html中的上述属性截止时间。
对,
<flip-countdown :deadline="remaining_time"></flip-countdown>
是正确的答案。
请确保您使用正确的日期时间YYYY-MM-DD HH:mm:ss
格式
这是一个例子https://github.com/philipjkim/vue2-flip-countdown/blob/master/demo/src/App.vue
您必须将其绑定到属性:
<flip-countdown v-bind:deadline="remaining_time"></flip-countdown>
或者干脆:
<flip-countdown :deadline="remaining_time"></flip-countdown>