微信小程序时间组件

写组件

js

		// Components/dataslect/dateselect.js
	const date = new Date();
	let years = [];
	let months = [];
	let days = [];
	let hours = [];
	let minutes = [];

	function getYear(params = 2018) {
		//获取年
		for (let i = params; i <= date.getFullYear() + 10; i++) {
			years.push("" + i);
		}
	}
	//获取月份
	function getMonth() {
		for (let i = 1; i <= 12; i++) {
			if (i < 10) {
				i = "0" + i;
			}
			months.push("" + i);
		}
	}
	//获取日期
	function getDays() {
		for (let i = 1; i <= 31; i++) {
			if (i < 10) {
				i = "0" + i;
			}
			days.push("" + i);
		}
	}

	//获取小时
	function getHours() {
		for (let i = 0; i < 24; i++) {
			if (i < 10) {
				i = "0" + i;
			}
			hours.push("" + i);
		}
	}

	//获取分钟
	function getMinutes() {
		for (let i = 0; i < 60; i++) {
			if (i < 10) {
				i = "0" + i;
			}
			minutes.push("" + i);
		}
	}

	Component({
		/**
		 * 组件的属性列表
		 */
		properties: {
			choose_year: {
				type: String,
				value: 2019,
			},
			noteInfo: {
				type: String,
				value: "选择时间",                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                        
			},
			startYear: {
				type: Number,
				value: 2015,
			},
			callbackTime: null
		},

		/**
		 * 组件的初始数据
		 */
		data: {
			time: '',
			multiArray: [],
			multiIndex: [0, 9, 16, 10, 17],

		},
		// created() {
		// 	// 初始化时间
		// 	this.setDate()
		// },
		/**
		 * 组件的方法列表
		 */
		methods: {
			// 初始化 数据
			setDate() {
				getYear(this.data.startYear)
				getMonth()
				getDays()
				getHours()
				getMinutes()
				this.setData({
					multiArray: [years, months, days, hours, minutes]
				})
				let {
					multiIndex, multiArray
				} = this.data
				console.log(multiIndex, multiArray)
				let count = 0
				let temp = []
				//获取年
				for (let i = this.data.startYear; i <= date.getFullYear() + 10; i++) {
					if (this.data.choose_year == i) {
						temp = multiIndex.map((item, index) => {
							if (index == 0) {
								item = count
							}
							return item
						})
					}
					count++
				}
				this.setData({
					multiIndex: temp
				})
			},
			//获取时间日期
			bindMultiPickerChange: function(e) {
				// console.log('picker发送选择改变，携带值为', e.detail.value)
				this.setData({
					multiIndex: e.detail.value
				})
				const index = this.data.multiIndex;
				const year = this.data.multiArray[0][index[0]];
				const month = this.data.multiArray[1][index[1]];
				const day = this.data.multiArray[2][index[2]];
				const hour = this.data.multiArray[3][index[3]];
				const minute = this.data.multiArray[4][index[4]];
				// console.log(`${year}-${month}-${day}-${hour}-${minute}`);
				this.setData({
					time: year + '-' + month + '-' + day + ' ' + hour + ':' + minute
				})
				this.triggerEvent( 'getTime',{
					time:  year + '-' + month + '-' + day + ' ' + hour + ':' + minute
				})
				// console.log(this.data.time);
			},
			//监听picker的滚动事件
			bindMultiPickerColumnChange: function(e) {
				//获取年份
				if (e.detail.column == 0) {
					let choose_year = this.data.multiArray[e.detail.column][e.detail.value];
					console.log(choose_year);
					this.setData({
						choose_year
					})
				}
				//console.log('修改的列为', e.detail.column, '，值为', e.detail.value);
				if (e.detail.column == 1) {
					let num = parseInt(this.data.multiArray[e.detail.column][e.detail.value]);
					let temp = [];
					if (num == 1 || num == 3 || num == 5 || num == 7 || num == 8 || num == 10 || num == 12) { //判断31天的月份
						for (let i = 1; i <= 31; i++) {
							if (i < 10) {
								i = "0" + i;
							}
							temp.push("" + i);
						}
						this.setData({
							['multiArray[2]']: temp
						});
					} else if (num == 4 || num == 6 || num == 9 || num == 11) { //判断30天的月份
						for (let i = 1; i <= 30; i++) {
							if (i < 10) {
								i = "0" + i;
							}
							temp.push("" + i);
						}
						this.setData({
							['multiArray[2]']: temp
						});
					} else if (num == 2) { //判断2月份天数
						let year = parseInt(this.data.choose_year);
						console.log(year);
						if (((year % 400 == 0) || (year % 100 != 0)) && (year % 4 == 0)) {
							for (let i = 1; i <= 29; i++) {
								if (i < 10) {
									i = "0" + i;
								}
								temp.push("" + i);
							}
							this.setData({
								['multiArray[2]']: temp
							});
						} else {
							for (let i = 1; i <= 28; i++) {
								if (i < 10) {
									i = "0" + i;
								}
								temp.push("" + i);
							}
							this.setData({
								['multiArray[2]']: temp
							});
						}
					}
					console.log(this.data.multiArray[2]);
				}
				var data = {
					multiArray: this.data.multiArray,
					multiIndex: this.data.multiIndex
				};
				data.multiIndex[e.detail.column] = e.detail.value;
				this.setData(data);
			}
		}
	})

wxml

<picker mode="multiSelector" bindchange="bindMultiPickerChange" bindcolumnchange="bindMultiPickerColumnChange" value="{{multiIndex}}" range="{{multiArray}}">
    <input value='{{time}}' placeholder='{{noteInfo}}'/>
</picker>

调用组件

wxss

/*
*getTime 自定义方法 用来字父之间传值
* choose_year  默认选择的时间
*startYear  开始的时间
*/
  <dateslect id="myComponent" bindgetTime="getTimefn" choose_year="{{2011}}" startYear="{{2000}}">1212</dateslect>

js

Page({
data: {
},
onLoad: function() {
  //设置默认的年份
},
onShow() {
    //  初始化组建中的时间时间参数
    this.selectComponent('#myComponent').setDate()
},
 getTimefn(params) {
    console.log(params)
 }
})