微信小程序 时间的切换和显示当天日期（好友帮助！）

微信小程序要实现一个框显示当前时间 点击左右按钮（前一天，后一天）实现日期的变换。

之前百度了很多方法，都很乱，所以说自己问了一下在写前端的朋友（大牛！）得到了解决方案。

下面先看个效果

 

 

代码部分：

wxml:

 

<view bindtap='btncud' class='b'>

<text>前一天</text>

</view>

 

<view class='c'>

<view class='icon'>

<image src='/images/deta.png' style='height:20px;width:20px;'></image>

</view>

 

<picker class='deta' mode="date" value="{{date}}" start="2015-09-01" end="2017-09-01" bindchange="bindDateChange">

<view>

<input class='' placeholder='{{date}}' value='{{date}}'></input>

</view>

</picker>

 

<view class='tubiao'>

<image src='/images/down.png' style='height:24px;width:24px;'></image>

</view>

</view>

 

<view bindtap='btnadd' class='d'>

<text>后一天</text>

</view>

js:

 

data: {

date: ""

},

 

// 点击日期确定事件

bindDateChange: function (e) {

console.log('picker发送选择改变，携带值为', e.detail.value)

this.setData({

date: e.detail.value

})

},

// 增加一天

btnadd: function () {

let Arr = this.data.date.split("-");

// 需要先转换为Wed Jul 05 2017 13:50:11 GMT+0800 (中国标准时间)这种型式

let now = new Date(Number(Arr['0']), (Number(Arr['1']) - 1), Number(Arr['2']))

now.setDate(now.getDate() + 1)

now = this.formatTime(now)

this.setData({

date: now

})

},

// 格式化时间

formatTime(date) {

var year = date.getFullYear();

var month = date.getMonth() + 1, month = month < 10 ? '0' + month : month;

var day = date.getDate(), day = day < 10 ? '0' + day : day;

return year + '-' + month + '-' + day;

},

// 减少一天

btncud: function () {

let Arr = this.data.date.split("-");

// 需要先转换为Wed Jul 05 2017 13:50:11 GMT+0800 (中国标准时间)这种型式

let now = new Date(Number(Arr['0']), (Number(Arr['1']) - 1), Number(Arr['2']))

now.setDate(now.getDate() - 1)

now = this.formatTime(now)

this.setData({

date: now

})

},

 

next_goupiao: function () {

wx.navigateTo({

url: '../ticket_msg/ticket_msg',

})

},

/**

* 生命周期函数--监听页面加载

*/

onLoad: function (options) {

 

},

 

/**

* 生命周期函数--监听页面初次渲染完成

*/

onReady: function () {

//在挂载的生命周期里运行 回调时间函数

let now = new Date();

let nowdate = this.formatTime(now);

this.setData({

date: nowdate

})

},