Vuejs: Как я могу передать значение vue js prop атрибуту html в качестве значения?

Question

Я хочу показать счетчик на оставшееся время в vuejs.Я использую библиотеку обратного отсчета Vue.Я хочу передать значение 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>

Я хочу передать оставшееся время выше атрибуту html в качестве значения, но этот код не работает.Пожалуйста, укажите, как передать оставшееся время в указанный выше крайний срок атрибута в html.

Answer 1

Вы должны связать его с атрибутом:

<flip-countdown v-bind:deadline="remaining_time"></flip-countdown>

или просто:

<flip-countdown :deadline="remaining_time"></flip-countdown>

Answer 2

Право,

<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