vue-quarter-picker

介绍

一款基于Vue2.0+Ant Design的季度选择组件。

npm install vue-quarter-picker --save

API

| props | 说明 | 类型 | 默认值 | 版本 | | --- | --- | --- | --- | --- | | value | 默认值 | string | "" | | | year | 最小的年份 | [Number, String, Date] | new Date() | | | month | 年度最小的月份 | [Number, String, Date] | new Date() | | | inputWidth | 文本框的宽度 | Number | 250 | | | isSelectedCurrentQuarter | 是否可以选择当前季度 | Boolean | false | @change | 选择框改变时的事件 | Function | (value) => {}

使用示例

注册指令

import {
  Icon,
  Input,
  Button,
  Popover
} from 'ant-design-vue'

const install = function (Vue) {
  Vue.component(Icon.name, Icon)
  Vue.component(Popover.name, Popover)
  Vue.component(Input.name, Input)
  Vue.component(Button.name, Button)
}

export default install

import 'vue-quarter-picker/es/styles/style.css'
import { QuarterSelect } from 'vue-quarter-picker'
export default {
    components: {
        QuarterSelect
    }
}

在组件中使用

<div>
    <QuarterSelect
        @selected="selectedQuarter"
        ref="quarterSelect"
        v-model="rateForm.effectDate">
    </QuarterSelect>
</div>