Analyse du sélecteur (heure, date, région) de l'applet WeChat

Cet article présente principalement les informations pertinentes sur l'explication détaillée de l'exemple de sélecteur d'applet WeChat (heure, date, région). L'exemple de code et les rendus d'implémentation sont fournis ici pour aider tout le monde à apprendre et à comprendre cette partie des connaissances. dans le besoin peuvent s'y référer. Suivant

Sélecteur d'applet WeChat (heure, date, région)

Développement d'applet WeChat Depuis que j'ai récemment appris le développement de l'applet WeChat, sur la base de mes propres résultats pratiques, j'ai trié les résultats et trouvé quelques exemples de sélecteur de date, de sélecteur d'heure et de sélecteur de région. S'il y a des erreurs, j'espère que vous pourrez les corriger.

Les contrôles emballés dans les enveloppes WeChat sont très agréables et nous évitent bien des ennuis aux développeurs. L'inconvénient est que nous ne pouvons pas faire beaucoup de personnalisation.

1.index.js

//index.js 
//获取应用实例 
var app = getApp() 
Page({ 
 data: { 
  date: '2016-11-08', 
  time: '12:00', 
  array: ['中国', '巴西', '日本', '美国'], 
  index: 0, 
 }, 
 
 onLoad: function () { 
 
 }, 
 // 点击时间组件确定事件 
 bindTimeChange: function (e) { 
  this.setData({ 
   time: e.detail.value 
  }) 
 }, 
 // 点击日期组件确定事件 
 bindDateChange: function (e) { 
  this.setData({ 
   date: e.detail.value 
  }) 
 }, 
 // 点击国家组件确定事件 
 bindPickerChange: function (e) { 
  this.setData({ 
   index: e.detail.value 
  }) 
 } 
}) 

2.index.wxml
[html] view plain copy
<!--index.wxml--> 
<view class="section" style="background:#787878;margin:20rpx;padding:20rpx"> 
 <picker bindchange="bindPickerChange" value="{{index}}" range="{{array}}"> 
  <view class="picker"> 
   国家：{{array[index]}} 
  </view> 
 </picker> 
</view> 
 
<view class="section" style="background:#787878;margin:20rpx;padding:20rpx"> 
 <picker mode="time" value="{{time}}" start="09:01" end="21:01" bindchange="bindTimeChange"> 
  <view class="picker"> 
   时间 : {{time}} 
  </view> 
 </picker> 
</view> 
<view class="section" style="background:#787878;margin:20rpx;padding:20rpx"> 
 <picker mode="date" value="{{date}}" start="2015-09-01" end="2017-09-01" bindchange="bindDateChange"> 
  <view class="picker"> 
   日期: {{date}} 
  </view> 
 </picker> 
</view>

①Sélecteur normal

②Sélecteur d'heure

déclenche l'événement bindTimeChange lorsqu'il est sélectionné et obtient l'heure.

③Sélecteur de date

est sélectionné et la date
.

Comment accéder et transférer des données dans l'applet WeChat

Comment utiliser setData dans l'applet WeChat

Comment utiliser setData dans l'applet WeChat

Comment utiliser le sélecteur de date et d'heure de l'applet WeChat

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!