The small program picker is not compatible with Apple mobile phones. When pressing the month, the display on the iPhone is incorrect and the automatic positioning time problem

As shown in the figure below: click to pop up the time list: click on the calendar control to select and display 1 year and January 

 solve:

plus the start time field

 <picker mode="date" value="{
   
   {date}}" start="1970-09-01" end="2030-09-01">
   </picker>

Question two:

Still: fields are a matter of month. After setting the start time, the pop-up date will not automatically locate the specified time according to the value. or format incompatibility

The ui requires the display of xxxx year xx month, but iphone is only compatible with the format xxxx-xx.

solution

Separate the value of the picker from the displayed value and display it in 2 fields, as follows:

Case source code:

wxml

<picker  mode="date" fields="month" value="{
   
   {currentDate}}" start="1800-01-01" end="2200-12-31" bindchange="startDateChange">
  {
   
   {currentFormatDate}}
</picker>

js

Page({
  startDateChange(e) {
    console.log(e)
    this.setData({
      currentDate: e.detail.value
    })
  }
  , data: {
    // 用于选择器
    currentDate: '',
    // 用于显示
    currentFormatDate: ''
  },
  onLoad: function (options) {
    let currentDate = new Date()
    this.setData({
      currentDate: currentDate.getFullYear() + '-' + currentDate.getMonth()+'-',
      currentFormatDate:currentDate.getFullYear() + '年' + currentDate.getMonth()+'月'
    })
  
  }
});

Effect: