vue-date-now

Easily work with dates using the available methods.

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

Install with npm:

npm install vue-date-now

or install with yarn

yarn add vue-date-now

Enable it in your project:

import VueDateNow from "vue-date-now";

Vue.use(VueDateNow);

Use the available methods:

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

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

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

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

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

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

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

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

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

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