uni-app制作一个时间选择器

<template>
  <view>
    <picker 
      mode="time" 
      :value="currentTime" 
      start="00:00" 
      end="23:59"
      @change="onTimeChange"
    >
      <view>{{ formattedTime }}</view>
    </picker>
  </view>
</template>
<script>
export default {
  data() {
    return {
      currentTime: '12:00',
      formattedTime: '12:00'
    };
  },
  methods: {
    onTimeChange(e) {
      this.currentTime = e.mp.detail.value;
      this.formatTime();
    },
    formatTime() {
      const date = new Date(`2023-12-22 ${this.currentTime}`);
      const hours = String(date.getHours()).padStart(2, '0');
      const minutes = String(date.getMinutes()).padStart(2, '0');
      this.formattedTime = `${hours}:${minutes}`;
    }
  }
};
</script>