Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Are there any plans to support input[type="date"]? #218

Open
cawa-93 opened this issue Oct 12, 2020 · 4 comments
Open

Are there any plans to support input[type="date"]? #218

cawa-93 opened this issue Oct 12, 2020 · 4 comments

Comments

@cawa-93
Copy link

cawa-93 commented Oct 12, 2020

I did not find any information about it. If has there been a discussion of this issue - please provide a link.

I'm surprised that Vue treats date fields like regular text fields, rather than converting values to the appropriate data type, as it does with numeric fields.

I expected to receive a "date" object or a timestamp with the following code:

<input type="date" v-model="date">

I also tried using a numeric modifier to get a timestamp, but it didn't work.

<input type="date" v-model.number="date">

Are there any obstacles to implementing support for date fields?

@jacekkarczmarczyk
Copy link

I'm surprised that Vue treats date fields like regular text fields

that's native behaviour

@Demivan
Copy link

Demivan commented Oct 12, 2020

Maybe it would make sense to have v-model.date modifier build in.

@jods4
Copy link

jods4 commented Oct 12, 2020

It's worth noting that browsers have a valueAsDate property that is a Date object rather than a string, as well as valueAsNumber.

Maybe it would make sense if we could choose which property is bound by v-model (doesn't work currently), e.g.

<input type="date" v-model:valueAsDate="x">

Maybe it's even better if Vue used a VModelDate and VModelNumber directives automatically based on type attribute, as it already does for VModelCheckbox, but that would be a breaking change + wouldn't work in downlevel browsers (e.g. IE11) where type=date is handled like type=text and valueAsDate doesn't exist.

Adding .date modifier is a nice alternative to native properties, and it could work in other contexts as well (e.g. a basic type=text, a custom component, etc.).
Note that parsing dates is a pain in browsers, but in type=date or type=datetime-local controls, value is specified to be in ISO format, which always parses fine.

<input type="date" v-model.date="x">

Workaround: here we use a small <my-date> wrapper around <input type=date> to automatically handle this conversion, + a bit more.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

5 participants
@cawa-93 @Demivan @jods4 @jacekkarczmarczyk and others