小程序配送時間、自提時間組件

配送時間組件參考:https://www.jianshu.com/p/d95f0fade2f5

自提組件設計如下:

index.wxml

 <view bindtap='chooseTime' > 自提時間{{storePickupTime}}</view>
<van-popup show="{{ showTime }}" bind:close="onClose" position="bottom">
  <time-picker deliveryTime='{{deliveryTime}}' bind:selectTime="selectTime" id="timepicker"></time-picker>
</van-popup>

index.js

// pages/patient/order/fill/index.js
const utils = require("../../../../utils/util.js");
const app = getApp()
var numeral = require('numeral');
Page({

  /**
   * 頁面的初始數據
   */
  data: {
    showTime: false,
    storePickupTime: ''
  },
  /**
   * 生命週期函數--監聽頁面初次渲染完成
   */
  onReady: function() {
    this.timepicker = this.selectComponent("#timepicker"); //組件的id
    this.timepicker.getDliveryTime();
  },  
  selectTime(e) {
    if (e.detail.deliveryTime && e.detail.deliveryTime !== this.data.storePickupTime) {
      this.setData({
        storePickupTime: e.detail.deliveryTime,
        showTime: false
      })
    }
  },
  onClose() {
    this.setData({
      showTime: false
    });
  },
  chooseTime() {
    this.setData({
      showTime: true
    })
    console.log(this.data.showTime)
    this.timepicker.getDliveryTime();
    console.log(this.data.showTime)
  },
  onClickButton() {
    this.setData({
      showModal: true
    })
  }
  }
})

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章