Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/mathiew82/vue-date-now

Easily work with dates using the available methods.
https://github.com/mathiew82/vue-date-now

date datetime vue vue-date-now vuejs

Last synced: 1 day ago
JSON representation

Easily work with dates using the available methods.

Host: GitHub
URL: https://github.com/mathiew82/vue-date-now
Owner: Mathiew82
License: mit
Created: 2019-06-16T21:05:28.000Z (over 5 years ago)
Default Branch: master
Last Pushed: 2024-01-30T11:21:18.000Z (8 months ago)
Last Synced: 2024-09-23T04:32:08.766Z (5 days ago)
Topics: date, datetime, vue, vue-date-now, vuejs
Language: JavaScript
Homepage:
Size: 971 KB
Stars: 5
Watchers: 2
Forks: 1
Open Issues: 0
Metadata Files:
- Readme: README.md
- License: LICENSE

Awesome Lists containing this project

README

        # vue-date-now

![](images/Logo_DateNow_Vue-min.png)

Easily work with dates using the available methods.

Feel free to collaborate. I would like to expand translations, so if you dare! 🚀

[![npm](https://img.shields.io/npm/v/vue-date-now.svg)](https://www.npmjs.com/package/vue-date-now)

[![npm bundle size (minified + gzip)](https://img.shields.io/bundlephobia/minzip/react.svg)](https://www.npmjs.com/package/vue-date-now)

[![npm](https://img.shields.io/npm/dt/vue-date-now.svg)](https://www.npmjs.com/package/vue-date-now)

[![dependencies Status](https://david-dm.org/Mathiew82/vue-date-now/status.svg)](https://david-dm.org/Mathiew82/vue-date-now)

![GitHub](https://img.shields.io/github/license/Mathiew82/vue-date-now)

 

#### Install with npm:

    npm install vue-date-now

#### or install with yarn

    yarn add vue-date-now

 

#### Enable it in your project:

```js

import VueDateNow from 'vue-date-now';

    

Vue.use(VueDateNow);

```

 

#### Use the available methods:

```js

export default {

    name: 'app',

    data () {

        return {

            year: this.$dn.year(),

            monthText: this.$dn.monthText()

        }

    }

}

```

 

## Documentation

### Notes:

    This documentation has been created on 2019-06-17.

    The monthText method supports all languages thanks to the toLocaleString() method of js

 

### Languages available for *howLong* and *dayText* methods:

| Slug | Language        |

|:-----|:----------------|

| es   | Spanish         |

| en   | English         |

 

### Methods

___

#### @ date()

##### # Parameters (3)

#####     1. # date

* Required: false

* Type: Date Object

* Default: new Date()

* Description: You can specify the date by passing this parameter with an instance of the Date object.

#####     2. # format

* Required: false

* Type: String

* Default: 'yyyy-mm-dd'

* Description: You can specify the format by passing it a string.

#####     3. # separator

* Required: false

* Type: String

* Default: '/'

* Description: You can specify the separator by passing it a string.

##### $ How to use

```js

this.$dn.date(new Date(), 'dd-mm-yyyy', '-') // result = 17-06-2019

this.$dn.date(new Date(), 'dd-mm-yyyy') // result = 17/06/2019

this.$dn.date(new Date()) // result = 2019/06/17

this.$dn.date() // result = 2019/06/17

```

___

#### @ howLong()

##### # Parameters (2)

#####     1. # date

* Required: true

* Type: Date Object || date String || timestamp String

* Description: It is required to specify the date to obtain the time since then.

#####     2. # language

* Required: false

* Type: String

* Default: 'en'

* Description: You can specify the language by passing it a string.

##### $ How to use

```js

this.$dn.howLong(new Date('2019-04-08'), 'en') // result = A few months ago

this.$dn.howLong('2016-04-22', 'en') // result = More than a year ago

this.$dn.howLong('2019-06-17 10:56:47', 'es') // result = Hace unas horas

```

___

#### @ year()

##### # Parameters (1)

#####     1. # date

* Required: false

* Type: Date Object || date String || timestamp String

* Default: ''

* Description: You can specify the date by passing this parameter with an instance of the Date object.

##### $ How to use

```js

this.$dn.year(new Date()) // result = 2019

this.$dn.year('2016-04-22') // result = 2016

this.$dn.year('2014-04-22 22:56:47') // result = 2014

this.$dn.year() // result = 2019

```

___

#### @ month()

##### # Parameters (1)

#####     1. # date

* Required: false

* Type: Date Object || date String || timestamp String

* Default: ''

* Description: You can specify the date by passing this parameter with an instance of the Date object.

##### $ How to use

```js

this.$dn.month(new Date()) // result = 06

this.$dn.month('2016-04-22') // result = 04

this.$dn.month('2014-02-14 22:56:47') // result = 02

this.$dn.month() // result = 06

```

___

#### @ monthText()

##### # Parameters (2)

#####     1. # date

* Required: false

* Type: Date Object || date String || timestamp String

* Default: ''

* Description: You can specify the date by passing this parameter with an instance of the Date object.

#####     2. # language

* Required: false

* Type: String

* Default: 'en'

* Description: You can specify the language by passing it a string.

##### $ How to use

```js

this.$dn.monthText(new Date(), 'en') // result = June

this.$dn.monthText('2016-01-22', 'es') // result = Enero

this.$dn.monthText('2014-03-22 22:56:47', 'es') // result = Marzo

this.$dn.monthText('', 'en') // result = June

this.$dn.monthText() // result = June

```

___

#### @ day()

##### # Parameters (1)

#####     1. # date

* Required: false

* Type: Date Object || date String || timestamp String

* Default: ''

* Description: You can specify the date by passing this parameter with an instance of the Date object.

##### $ How to use

```js

this.$dn.day(new Date()) // result = 2

this.$dn.day('2016-04-22') // result = 6

this.$dn.day('2014-02-14 22:56:47') // result = 3

this.$dn.day() // result = 2

```

___

#### @ dayText()

##### # Parameters (2)

#####     1. # date

* Required: false

* Type: Date Object || date String || timestamp String

* Default: ''

* Description: You can specify the date by passing this parameter with an instance of the Date object.

#####     2. # language

* Required: false

* Type: String

* Default: 'en'

* Description: You can specify the language by passing it a string.

##### $ How to use

```js

this.$dn.dayText(new Date(), 'en') // result = Monday

this.$dn.dayText('2016-01-22', 'es') // result = Viernes

this.$dn.dayText('2014-03-22 22:56:47', 'es') // result = Sábado

this.$dn.dayText('', 'en') // result = Monday

this.$dn.dayText() // result = Monday

```

___

#### @ diff()

##### # Parameters (3)

#####     1. # date

* Required: true

* Type: Date Object || date String || timestamp String

* Description: It is required to specify the most current date of the comparison.

#####     2. # date

* Required: true

* Type: date String || timestamp String

* Description: It is required to specify the oldest date of comparison.

#####     3. # type

* Required: false

* Type: String

* Default: 'days'

* Available values: 'seconds', 'minuts', 'hours', 'days', 'weeks', 'months', 'years'

* Description: You can specify the type of data to return.

##### $ How to use

```js

this.$dn.diff(new Date(), '2016-08-21', 'years') // result = 2.8

this.$dn.diff('2019-03-15', '2016-08-21', 'months') // result = 31.2

this.$dn.diff('2019-03-15', '2016-08-21') // result = 936.0

```

___

#### @ time()

##### # Parameters (0)

#####     0. # without parameters

##### $ How to use

```js

this.$dn.time() // result = 18:31:48

```

___