Переместить фокус на поле со списком вместо чипа в VuetifyJS - PullRequest
Новая
       18

Переместить фокус на поле со списком вместо чипа в VuetifyJS

0 голосов
/ 09 сентября 2018

Если вы воспользуетесь клавишей табуляции в этом примере VuetifyJS / VueJS , то микросхема фокусируется первой и только после второй вкладки - текстовое поле комбинированного списка . Как сначала сфокусировать текстовое поле со списком вместо чипа? 

<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>

1 Ответ

0 голосов
/ 09 сентября 2018

Используйте свойство tabindex, чтобы указать порядок табуляции элементов.
Следующее сделает входной фокусировкой возможность до чипа. 

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

Чтобы предотвратить фокусировку элемента, вы можете установить tabindex на -1.
Обратите внимание, что значением по умолчанию является 0.

...