获取验证码倒计时60秒

<template>
	<view class="content">
	
	
		<view class="inps">
			<input class="inp" type="text" v-model="verify" value="" placeholder="请输入验证码"/>
			<button type="default" @click="yanzheng" v-show="show">获取验证码</button>
			<button type="default" v-show="!show">已发送({{time}})</button>
		</view>

	</view>
</template>

<script>
	export default {
		data() {
			return {
				time:60,
				show:true,
				
			}
		},
		onLoad() {
			
		},
		methods: {
			timed(){
				var that=this
				var times=setInterval(function(){
					that.time--;
					if(that.time == 0){
						clearInterval(times)
						that.time = 60
						that.show = true
					}
				},1000)
			},
			yanzheng(){
				if(this.phone){
					this.$myRequest({
						url: `url`, 
						method:'post',
						data:{
							phone: this.phone,
							type:'2',
						}
					}).then(data=>{
						var message = data.data.message
						var phone = this.phone
						this.$myRequest({
							url: `/app/sms/sendMessage?phone=${phone}&verifyCode=${message}`, 
							method:'post',
							data:{
								phone: this.phone,
								type:'',
								verifyCode:data.data.message
							}
						}).then(data=>{
							console.log(data)
							if(data.data.code == 200){
								this.show = false
								this.timed();
							} else {
								uni.showToast({
									title: data.data.message,
									icon: 'none',    //如果要纯文本，不要icon，将值设为'none'
									duration: 2000    //持续时间为 2秒
								})
							}
							
						})
					})
					
				} else {
					uni.showToast({
						title: '请填写手机号',
						icon: 'none',    //如果要纯文本，不要icon，将值设为'none'
						duration: 2000    //持续时间为 2秒
					})  
				}
			}
		}
	}
</script>
<style>
	page{
		width: 100%;
		height: 100%;
	}
</style>
<style lang="scss" scoped>
	.content {
		width: 100%;
		height: 100%;
		background: #F5F5F5;
		position: relative;
		overflow: auto;
		box-sizing: border-box;
		.rongli{
			width: 240rpx;
			height: 80rpx;
			display: block;
			margin: 0 auto;
			margin-top: 15%;
		}
		.mycontent{
			width: 100%;
			height: 380rpx;
			background: url(../../static/image/ju.png) no-repeat;
			background-size: 100% 100%;
			color: #FFFFFF;
			padding: 20rpx;
		}
		.inps{
			width: 100%;
			height: 100rpx;
			padding: 15rpx;
			display: flex;
			justify-content: center;
			align-items: center;
			border-bottom: 1px solid #C8C9CC;
			button{
				font-size: 26rpx;
				width: 200rpx;
				color: #FFFFFF;
				background: #f02e4b;
				border-radius: 50rpx;
			}
			.inp{
				flex: 1;
			}
		}
		.xiabut{
			width: 90%;
			height: 100rpx;
			border-radius: 50rpx;
			margin-top: 80rpx;
			line-height: 100rpx;
			background: #f02e4b;
			color: #FFFFFF;
		}
	}
</style>