Vuetify v-select 設定 width 要寫在外面的自訂 css, 而且外面要有一個 <div>
孫柏青
1 min read
今天問了 chatGPT, 但他給的答案都沒有 div, 沒有效果。
原生的 select 用 css 設定 width 卻就可以: https://jsfiddle.net/sunpochin/dLbqe8f0/2/
直到我看到這篇,偶然的加上 div, 才發現 width 神奇的改變了。
https://stackoverflow.com/a/71231747/720276
做個筆記免得自己忘記,要寫成下面這樣。
<template>
<div class="custom-width">
<v-select
label="Filter by Region"
:items="[
'Africa',
'Americas',
'Asia',
'Europe',
'Oceania',
'Antarctica',
]"
variant="outlined"
/>
</div>
</template>
<style lang="scss" scoped>
.custom-width {
width: 600px; /* 使用 CSS 自訂寬度 */
}
</style>
0
Subscribe to my newsletter
Read articles from 孫柏青 directly inside your inbox. Subscribe to the newsletter, and don't miss out.
Written by