Search code examples
vue.jsvuetify.jsv-select

Vuetify Select Component Initial Value issue


I have vuetify webpack project

In one of my vue components I use v-select with :items set to common array of numbers named 'levels', and v-model set to data property 'level' that holds common number

So the issue is that v-select doesn't show initial value at startup if 'level' is initialized with prop - and shows ok if 'level' is initialized by constant. Smth like this:

  props: ['initLevel'],
  data () {
    return {
      levels,
      level: this.initLevel
    }
  }

this isn't working correct, but this:

...
level: 25
...

works fine

v-select usage is:

         <v-select
            label="Select Level"
            :items="levels"
            v-model="level"
            max-height="200"
            dense
            autocomplete
          >
        </v-select>

Besides initial value showing at startup problem, v-select works fine

So how to solve this problem and what's the reason of it?


Solution

  • Ok I found the problem it was in types: levels is an array of ints, and prop went as string standard html select had no problem with it, but v-select had!