@thtf/element-datepicker v0.0.2

基于 Element-UI DatePicker 的季度选择器。

依赖

Vue 2.6.10+

Element-UI 2.15.6+

安装

npm install @thtf/element-datepicker

快速上手

// 使用组件
<template>
  <div id="app">
    <div class="block">
      <span class="demonstration">季度选择</span>
      <date-picker
        v-model="value1"
        clearable
        type="quarter"
        format="yyyy年QQ季度"
        value-format="yyyyQQ"
        placeholder="选择日期"
      />
    </div>
    <div class="block">
      <span class="demonstration">半年选择</span>
      <date-picker
        v-model="value2"
        clearable
        type="halfYear"
        format="yyyy年[BB]半年"
        value-format="yyyyBB"
        placeholder="选择日期"
      />
    </div>
  </div>
</template>

<script>
  import DatePicker from '@thtf/element-datepicker';

  export default {
    name: 'app',
    components: {
      DatePicker,
    },
    data() {
      return {
        value1: '',
        value2: '',
      };
    },
  };
</script>

日期格式

使用format指定输入框的格式；使用value-format指定绑定值的格式。

默认情况下，组件接受并返回Date对象。以下为可用的格式化字串，以 UTC 2017年1月2日 03:04:05 为例：

:::warning 请注意大小写 :::

属性

事件

方法