# vue-halfday-datepicker

> A date picker

Latest version **1.0.10** (published 2020-06-16) · MIT license · 0 weekly downloads

## Install

```sh
npm install vue-halfday-datepicker
pnpm add vue-halfday-datepicker
yarn add vue-halfday-datepicker
bun add vue-halfday-datepicker
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.10 |
| Published | 2020-06-16 |
| First published | 2020-06-08 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 0 |
| Unpacked size | 232.1 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 7 |
| Author | habc0807 |
| Maintainers | gaobingyan |

## Links

- npm: https://www.npmjs.com/package/vue-halfday-datepicker
- Repository: https://github.com/habc0807/vue-halfday-datepicker
- Homepage: https://github.com/habc0807/vue-halfday-datepicker#readme
- Issues: https://github.com/habc0807/vue-halfday-datepicker/issues
- npm.io page: https://npm.io/package/vue-halfday-datepicker

## Recent versions

- 1.0.10 (latest) — 2020-06-16
- 1.0.9 — 2020-06-16
- 1.0.8 — 2020-06-16
- 1.0.7 — 2020-06-15
- 1.0.6 — 2020-06-15
- 1.0.5 — 2020-06-12
- 1.0.4 — 2020-06-11
- 1.0.3 — 2020-06-11
- 1.0.2 — 2020-06-10
- 1.0.1 — 2020-06-09
- 1.0.0 — 2020-06-08

## README

# vue-halfday-datepicker

> 一个基于vue的带上、下午的移动端日期选择器

## Demo

[在线地址](https://habc0807.github.io/vue-halfday-datepicker/index.html)

## 特点

- 移动端
- 带上、下午
- vue插件

## 安装

```
npm i vue-halfday-datepicker -D
cnpm i vue-halfday-datepicker -D
yarn add vue-halfday-datepicker -D
```

## 引入和注册 
在单页面应用的入口文件里引入和注册

```javascript
import VueHalfdayDatepicker from 'vue-halfday-datepicker'
Vue.use(VueHalfdayDatepicker)
```

## 使用 

``` vue
<template>
  <div id="app">
    <h2>一个基于vue的日期选择器Demo</h2>

    <div class="pickerSelect" @click="onOpenPicker">{{ pickerValue }}</div>
    <vue-halfday-datepicker :show="isShow" @onConfirm="onConfirmHandle" @onCancel="onCancelHandle"/>
  </div>
</template>

<script>
export default {
  name: 'app',
  data () {
    return {
      isShow: false,
      pickerValue: '测试一下：请选择'
    }
  },
  methods: {
    onOpenPicker(e) {
        this.isShow = true
    },
    onConfirmHandle(v) {
        this.value = v
        this.pickerValue = v
        this.isShow = false
    },
    onCancelHandle(e) {
        this.isShow = false
    }
  },
}
</script>
<style>
</style>
```

---
_Source: https://npm.io/package/vue-halfday-datepicker · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._