倒計時無法停止

<div id="app">

<div class="main">
    <div  v-for="item in items"  >
        {{item.day}}天{{item.hour}}時{{item.minute}}分{{item.second}}秒
    </div>
</div>

</div>
<scrip>
var app = new Vue({

el:'#app',
data:{
        items: [
            {day: '   ', hour: '   ', minute: '   ', second: '   '}
        ]
},
created:function(){
    this.getMyTime();
    this.start();
},
methods: {
    format: function (n) {
        return n < 10 ? '0' + n : n;
    },
    getMyTime: function () {
        var startDate = new Date();
        var endDate = new Date('2018/3/30 11:10:00');
        var countDown = parseInt(endDate.getTime() - startDate.getTime()) / 1000;
        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;
        var id = setInterval(function () {
            that.getMyTime();
        }, 500);
    beforeDestroy: function () {
        if (countDown <= 0) {
            if (that.getMyTime()) {
                clearInterval(that.getMyTime());
                // console.log("投票結束！");
            }
        }
    }
}

})
</scrip>