在VuetifyJS中将焦点移至组合框字段而不是芯片

Question

如果你去使用键盘tab-key in this VuetifyJS/VueJS example，那么芯片首先会被聚焦，只有在第二个选项卡之后才会聚焦组合框文本字段。如何首先关注组合框文本域而不是芯片？

<v-flex xs12 sm6 md3>
      <v-text-field label="Regular" autofocus></v-text-field>
    </v-flex>

    <v-flex xs12>
      <v-combobox v-model="select" :items="items" chips label="I use a scoped slot">
        <template slot="selection" slot-scope="data">
          <v-chip
            :selected="data.selected"
            :disabled="data.disabled"
            :key="JSON.stringify(data.item)"
            class="v-chip--select-multi "
            @input="data.parent.selectItem(data.item)"
          >
            <v-avatar class="accent white--text">
              {{ data.item.slice(0, 1).toUpperCase() }}
            </v-avatar>
            {{ data.item }}
          </v-chip>
        </template>
      </v-combobox>
    </v-flex>

Answer 1

使用tabindex属性指定元素的Tab键顺序。 以下将使芯片前的输入可聚焦。

<v-combobox tabindex="1">
<v-chip tabindex="2">

要防止元素获得焦点，您可以将tabindex设置为-1。 请注意，默认值为0。