uView——倒计时

后台返回订单结束的时间(这里的例子返回的是秒数)
在这里插入图片描述

代码:

<!-- 12小时24分后,自动关闭订单 -->
<u-count-down :time="countDownTime" format="DD:HH:mm:ss" autoStart millisecond @change="onChange">
	<view class="time">
		<text class="time__item" v-if="timeData.days">{
    
    {
    
    timeData.days}}</text>
		<text class="time__item" v-if="timeData.hours">{
    
    {
    
    timeData.hours>10?timeData.hours:'0'+timeData.hours}}</text>
		<text class="time__item" v-if="timeData.minutes">{
    
    {
    
    timeData.minutes}}</text>
		<text class="time__item">{
    
    {
    
    timeData.seconds}}</text>
		<text class="time__item">后,自动关闭订单</text>
	</view>
</u-count-down>
data() {
    
    
	return {
    
    
		// 倒计时关闭订单
		countDownTime: 0,
		timeData: {
    
    },
	}
},
methods:{
    
    
	onChange(e) {
    
    
		this.timeData = e
		if (!this.timeData.days && !this.timeData.hours && !this.timeData.minutes && !this.timeData.seconds) {
    
    
			this.getOrderDetails()
		}
	}
	//接口返回的数
	let time = new Date().valueOf() //获取当前的时间戳
	this.countDownTime = (res.data.time * 1000) - time //未来的时间戳减去当前的时间戳就是要倒计时的时间
}

网址

https://www.uviewui.com/components/countDown.html

猜你喜欢

转载自blog.csdn.net/xulihua_75/article/details/128410069