Razbezhkin
@Razbezhkin
программист, преподаватель

Как сделать ширину v-select равной ширине контента во vuetify?

У меня вот такой код:

<v-row align="center" justify="space-between">
    <v-col>
        <v-pagination left :length="paginatorPages" v-model="currentPage" :disabled="loadInProgress">
        </v-pagination>
    </v-col>
    <v-col>
        <v-select :items="pagesizes" v-model="filters.pagesize" @change="changePagesize" :disabled="loadInProgress"></v-select>
        </v-col>
    </v-row>

в v-select отображаются такие элементы: 4,10,20,50,100.

Как мне нужно изменить код, чтобы v-select занимал не всю ширину контейнера, в котором он находиться, а столько, сколько ему необходимо для отображения своих чисел и чтобы он был выровнен по правому краю.

и что нужно сделать, чтобы v-pagination был прилеплен к левому краю.

Спасибо.
  • Вопрос задан
  • 136 просмотров
Решения вопроса 1
MrGrump
@MrGrump
Вы можете для v-col задать пропc cols="auto" что скажет колонкам не занимать все свободное пространство на оси, а между колонками вставить элемент v-spacer который на оборот будет стараться занять все свободное пространство (собственно на этом его все задачи и заканчиваются). Так же могу посоветовать скрыть невидимый input у v-select при помощи стилей, он так же дет лишнюю не желательную ширину

Ответ написан
Пригласить эксперта
Ответы на вопрос 1
IgorPI
@IgorPI
Как мне нужно изменить код, чтобы v-select занимал не всю ширину контейнера, в котором он находиться, а столько, сколько ему необходимо для отображения своих чисел и чтобы он был выровнен по правому краю.


Да там же в примерах есть как это делается
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы