js实现签署倒计时功能

 <i-button type="primary" shape="circle" @click="againSign" :disabled="!timeFlag" style="width: 200px">{{btnText}}</i-button>



<script>
    new Vue({
        el: '#app',
        data: function() {
            return{
                btnText:'我同意并签署该合同（10s）',
                timeFlag:false,
                downTime:'2',
                timer:null,
            }
        },
        mounted:function() {
            var _this = this;
             _this.againSignNew()
        },
        methods: {
            countDown:function(){
                var _this = this;
                var sys_second = _this.downTime
                _this.timer = setInterval(function () {
                        if (sys_second > 1) {
                            sys_second -= 1;
                            var second = Math.floor(sys_second % 60);
                            if (second > 0) {
                                if (second < 10) {
                                    second = second;
                                }
                                _this.btnText = "我同意并签署该合同（" + second + "s）";
                            }
                        } else {
                            clearInterval(_this.timer);
                            _this.timeFlag = true;
                            _this.btnText = "我同意并签署该合同";
                        }
                    },
                    1000);
            },
            againSignNew:function(){
                var _this = this;
                _this.againSignModel = true
                _this.timeFlag = false
                clearInterval(_this.timer);
                _this.btnText="我同意并签署该合同（" + _this.downTime + "s）";
                _this.countDown()
                $.ajax({
                    type: 'post',
                    url: '../../data/companyNotice.json',
                    data: {
                        type:_this.contractType,
                    },
                    dataType: 'json',
                    success: function (data) {
                        console.log(111)
                    },
                    error: function () {
                        _this.$Message.error('请求失败，请稍后重试！')
                    }
                });
            },
        }
    })
</script>

图片示例：初始化：

 倒计时结束：