如何 return 日期格式从 Bootstrap-vue 的 b-form-timepicker 组件从 HH:mm:ss 到 HH:mm

Question

Bootstrap-vue b-form-timepicker returns value 与格式 HH:mm:ss 一样。我需要它的 return 值作为 HH:m'，但我找不到任何方法来改变它。

有什么办法可以把return的值格式改成HH:mm吗？如果有请帮忙

Answer 1

您可以按照 component table properties. Then we'll format the date using vanilla JavaScript inside a Vue's watcher 中所述删除属性 show-seconds 来删除秒数，如下所示：

<template>
  <div>
    <label for="example-input">Choose a time</label>
    <b-input-group class="mb-3">
      <b-form-input
        id="example-input"
        v-model="value"
        type="text"
        placeholder="HH:mm"
      ></b-form-input>
      <b-input-group-append>
        <b-form-timepicker
          v-model="value"
          button-only
          right
          locale="en"
          aria-controls="example-input"
        ></b-form-timepicker>
      </b-input-group-append>
    </b-input-group>
    <p>Value: '{{ value }}'</p>
  </div>
</template>

<script>
export default {
  name: "App",
  data() {
    return {
      value: "",
    };
  },
  watch: {
    value() {
      this.value = this.value.split(':').slice(0,2).join(':');
    },
  },
};
</script>

你可以检查这个working code playground example。

如何 return 日期格式从 Bootstrap-vue 的 b-form-timepicker 组件从 HH:mm:ss 到 HH:mm

How to return date format from Bootstrap-vue's b-form-timepicker component from HH:mm:ss to HH:mm

vue.js

bootstrap-vue