Skip to content

nativescript vue DatePickerField no v-model support? #335

Open

Description

@Bheam

Appologies in advance if i'm doing something wrong, found it weird noone else reported this.

Tried all sorts of combinations, binding to a string or a Date() but no luck.

<DatePickerField hint="Birthdate" :minDate="minDate" :maxDate="maxDate" v-model="birthDate" />

export default class About extends Vue {
minDate = new Date("1900-01-01");
maxDate = new Date("2010-01-01");
birthDate = new Date("2000-01-01");
...

An uncaught Exception occurred on "main" thread.
Calling js method onCreateView failed
TypeError: dateTime.getTime is not a function

StackTrace:
formatDateTime(file:///data/data/org.blah/files/app/vendor.js:43966:54)
at getFormattedDate(file:///data/data/org.blah/files/app/vendor.js:43169:89)
at updateText(file:///data/data/org.blah/files/app/vendor.js:43150:38)
at _updateRegionalSettings(file:///data/data/org.blah/files/app/vendor.js:43177:14)
at initNativeView(file:///data/data/org.blah/files/app/vendor.js:43154:14)

Thanks,

Michael

Activity

  1. subjekt-iv commented on Apr 19, 2023

    @subjekt-iv

    hey! any updated on this issue? how did you get the selected date data?

  2. asharghi commented on Apr 19, 2023

    @asharghi
    Contributor

    Not sure about this plugin but it's really easy to create your own picker with this https://nativescript-vue.org/en/docs/elements/components/date-picker/

  3. subjekt-iv commented on Apr 19, 2023

    @subjekt-iv

    yes! works perfect on Android but not on ios. It makes the app crash with no error logs at all. The app is running in ios 16 and using "@nativescript/ios": "8.5.1-alpha.0". Finally, I decided to use a texField with a function that autoformats the date typed by the user:

    <TextView
                v-model="returnedValue"
                hint="Fecha de Nacimiento (yyyy/mm/dd)"
                style="placeholder-color: rgba(151, 151, 151, 1)"
                width="100%"
                textAlignment="Left"
                maxLength="10"
                @textChange="onTextChanged"
              />
    
    
    data() {
        return {
              returnedValue: '',
    }}
       onTextChanged(args) {
          const text = args.value;
          if (text.length === 4 || text.length === 7) {
            args.object.text = text + '/';
          }
          console.log(this.returnedValue);
        },
    
  4. asharghi commented on Apr 19, 2023

    @asharghi
    Contributor

    Nice :) Which version of @nativescript/core do you use? I'm using the date picker I linked to on both iOS and Android without problems. And if you are using the newest core, there is also a built in formater in TextField (as of 8.5.1). The property is called valueFormatter: NativeScript/NativeScript#10264

  5. apburgess commented on Oct 9, 2023

    @apburgess

    Still seeing this issue.
    ✔ Getting NativeScript components versions information...
    ✔ Component nativescript has 8.5.3 version and is up to date.
    ✔ Component @nativescript/core has 8.5.9 version and is up to date.
    ✔ Component @nativescript/ios has 8.5.2 version and is up to date.
    ✔ Component @nativescript/android has 8.5.4 version and is up to date.
    DateTimePicker version is 2.1.13.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions