Vuetify选择组件初始值问题

时间:2018-01-29 11:05:24

标签: vue.js vuetify.js v-select

我有vuetify webpack项目

在我的一个vue组件中,我使用v-select:将项目设置为名为“levels”的公共数字数组,将v-model设置为包含公共数字的数据属性“level”

所以问题是v-select在启动时没有显示初始值,如果'level'用prop初始化 - 并且如果'level'被常量初始化则显示ok。像这样的Smth:

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

这不正确,但是这个:

...
level: 25
...

工作正常

v-select用法是:

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

除了初始值显示启动问题外,v-select工作正常

那么如何解决这个问题又是什么原因呢?

2 个答案:

答案 0 :(得分:4)

好的,我发现了问题 它是在类型中:levels是一个int数组,prop是字符串 标准的html选择没有问题,但v-select有!

答案 1 :(得分:0)

我认为在任何属性值可用之前调用data()

您可以尝试将初始化从data()移至beforeMount(),如下所示:

props: ['initLevel'],

data() {
    return {
        levels: ...,
        level: 0
    }
},

beforeMount() {
     this.level = this.initLevel
}