Vue 第一个按钮点击跳出倒计时，第二个按钮点击跳出固定的数据

Question

Vue 第一个按钮点击跳出倒计时，第二个按钮点击跳出固定的数据，但是跳出的固定数据一下子又跳回自动倒计时

var app = new Vue({

el:'#app',
data:{
        items: [
            {day: '   ', hour: '   ', minute: '   ', second: '   '}
        ]

},

methods: {

    format: function (n) {
        return n < 10 ? '0' + n : n;
    },
    getMyTime: function () {
        var startDate = new Date();
        var endDate = new Date('2018/3/31 11:10:00');
        var countDown = parseInt(endDate.getTime() - startDate.getTime()) / 1000;
        var time1=countDown;
        var day = parseInt(countDown / (24 * 60 * 60));
        var h = parseInt(countDown / (60 * 60) % 24);
        var m = parseInt(countDown / 60 % 60);
        var s = parseInt(countDown % 60);
        this.items[0].day = day;
        this.items[0].hour = this.format(h);
        this.items[0].minute = this.format(m);
        this.items[0].second = this.format(s);
    },
    start: function () {
        var that = this;
        setInterval(function () {
            that.getMyTime();
        }, 1000);
    },
    change:function(){

           Vue.set(this.items,0,{
               day:2,hour:2,minute:2,second:2
           })
        clearInterval(this.items);
    }
}
})

Answer 1

你这 clearInterval根本没用啊

...
start: function () {
        var that = this;
        this.timer = setInterval(function () {
            that.getMyTime();
        }, 1000);
    },
    change:function(){
        clearInterval(this.timer);
           Vue.set(this.items,0,{
               day:2,hour:2,minute:2,second:2
           })
        
    }