Laravel Vue倒计时在IOS浏览器上不起作用

使用Laravel在Vue中进行倒计时

嗨，我在Vue.js和Laravel中创建了一个倒计时，它在所有浏览器中都能完美工作，但在IOS浏览器上却不能

在这里您可以看到我的代码：

刀片文件上的Vue组件

<countdown-button
          until="{{ $active->ends_at }}"
          url='{{ route('dashboard.active.show', $active->uuid) }}' />

正如您所看到的，它是一个使用道具的普通组件，我必须在不使用的情况下使用“：“因为如果我添加它，我会得到一个错误，它说它必须是字符串的一个数字实例，当与道具一起使用时

这是我的Vue.js组件

<template>
    <div class="countdown__container">
        <div v-if="finished">{{ endsAt }}</div>

        <div v-else class="countdown__date--container">
            <div class="countdown__date--item2">
                <span>{{ remaining.days }} days</span>
                <span>{{ remaining.hours }} hours </span>
                <span>{{ remaining.minutes }} minutes </span>
                <span>{{ remaining.seconds }} seconds </span>
            </div>
        </div>
        <div :show="butt" class="lower-box">
            <a :href="url" class="theme-btn style-one">
                <i class="fas fa-user"></i>PLAY NOW
            </a>
        </div>
    </div>
</template>

<script>
    import moment from 'moment';

    export default {
        props: {
            url: String,
            until: {
                type: String,
                required: true,
            },
            endsAt: { default: 'Game finished!' },

        },
        data () {
            return {
                now: new Date(),
                butt: true,
            };
        },
        created () {
            this.refreshEverySecond();
        },
        computed: {

            finished () {
                return this.remaining.total <= 0;
            },
            remaining () {

                let remaining = moment.duration(Date.parse(this.until) - this.now);

                if (remaining <= 0) this.$emit('finished');

                return {
                    total: remaining,
                    years: this.pad(remaining.years(),2),
                    months: this.pad(remaining.months(),2),
                    days: this.pad(remaining.days(),2),
                    hours: this.pad(remaining.hours(),2),
                    minutes: this.pad(remaining.minutes(),2),
                    seconds: this.pad(remaining.seconds(),2)
                };
            }
        },
        methods: {

            pad(num, size) {
                var s = "000000000" + num;
                return s.substr(s.length-size);
            },
            refreshEverySecond () {
                let interval = setInterval(() => this.now = new Date(), 1000);
                this.$on('finished', () => {
                    clearInterval(interval);
                    this.butt = false;
                });
            }
        }
    }
</script>

<style lang="scss">
   .countdown__date--item2 {
       font-size: 16px;
       color: orange;
       font-weight: bold;
   }
</style>

{{endsAt}}
{{剩余的.days}}天
{{剩余的.hours}}小时
{{剩余的.minutes}}}分钟
{{剩余的.seconds}}}秒
从“力矩”中导入力矩；
导出默认值{
道具：{
url:String，
直至：{
类型：字符串，
要求：正确，
},
endsAt:{default:'游戏结束！'}，
},
数据（）{
返回{
现在：新日期（），
巴特：是的，
};
},
创建（）{
这个。刷新每秒钟（）；
},
计算：{
完成（）{
返回此.remaining.total{
间隔时间；
this.butt=false；
});
}
}
}
.倒计时日期--项目2{
字体大小：16px；
颜色：橙色；
字体大小：粗体；
}

这个组件只有两个道具，它们是url和endsAt。 它只显示倒计时

它100%适用于桌面浏览器和andriod

但在IOS浏览器上显示：

---

我认为您应该在computed

remaining

中使用矩

diff（）

：

剩余（）{
let until=力矩（）.从（这个.直到）；
let now=来自（this.now）的力矩（）；
让剩余=力矩（）.duration（直到.diff（现在））；
如果（剩余我认为您应该在计算的
剩余
中使用矩
diff（）
：

剩余（）{
let until=力矩（）.从（这个.直到）；
let now=来自（this.now）的力矩（）；
让剩余=力矩（）.duration（直到.diff（现在））；
如果（剩余我的错误：使用
moment（）.from（…）
。我更新了示例代码。我用你的代码更新了示例代码，我得到了那个错误。这是针对矩对象的，我想我的错误：使用
moment（）.from（…）
。我更新了示例代码。我用你的代码更新了示例代码，我得到了那个错误。我想是针对矩对象的