uniapp使用picker选择时间

文章描述:

uniapp使用picker选择时间年、月、日

template

<template>
    <view>
     <picker mode="date" :value="date" :start="startDate" :end="endDate" @change="bindDateChange">
         <view class="uni-input">{{date}}</view>
     </picker>
    </view>
</template>

script

export default{
	 data() {
		const currentDate = this.getDate({
	        format: true
	    })
	    return {
	        date: currentDate, 
	    }
	},
	computed: {
	    startDate() {
	        return this.getDate('start');
	    },
	    endDate() {
	        return this.getDate('end');
	    }
	},
	methods: {
	    
	    bindDateChange: function(e) {
	        this.date = e.target.value
	    },
	    getDate(type) {
	        const date = new Date();
	        let year = date.getFullYear();
	        let month = date.getMonth() + 1;
	        let day = date.getDate();
	
	        if (type === 'start') {
                year = year - 60;
            } else if (type === 'end') {
                year = year + 2;
            }
            month = month > 9 ? month : '0' + month;
            day = day > 9 ? day : '0' + day;
            return `${year}-${month}-${day}`;
        }
    }
}

 

发布时间:2021/11/23

发表评论