メニューが入力ボックスを覆ってほしくない。私のVuetifyのバージョンは2.3.18です。これを修正するにはどうすればよいですか?
私はこれを見つけましたが、私にはうまくいきません: https://codepen.io/jrast/pen/NwMaZE?editors=1010
Vuetify githubのバグを見つけました: https://github.com/vuetifyjs/vuetify/issues/2377
Vuetify
v-select
Codepenの例:
https://codepen.io/zmrqodfu/pen/abZeVOP?editors=101
Vue.use(Vuetify);
var vm = new Vue({
el: "#app",
methods: {
},
data () {
return {
select: { state: 'Florida', abbr: 'FL' },
hideDetails: false,
items: [
{ state: 'Florida', abbr: 'FL' },
{ state: 'Georgia', abbr: 'GA' },
{ state: 'Nebraska', abbr: 'NE' },
{ state: 'California', abbr: 'CA' },
{ state: 'New York', abbr: 'NY' }
]
}
},
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.4.3/vue.js"></script>
<script src="https://unpkg.com/vuetify@0.14.8/dist/vuetify.min.js"></script>
<link rel=stylesheet type="text/css" href="https://unpkg.com/vuetify@0.14.8/dist/vuetify.min.css">
<div id="app">
<v-app dark>
<v-select
v-bind:items="items"
v-model="select"
label="Select"
single-line
:hide-details="hideDetails"
hint="Hint of Select"
item-text="state"
item-value="abbr"
return-object
autocomplete
></v-select>
</v-app>
</div>
回答 1 件
関連記事
- javascriptを使用してテキストフィールドの入力番号を1から9の間に制限する方法
- SwiftUI:入力が無効な場合にテキストフィールドをアニメーション化する
- Vuetifyを使用してtextField内のテキストを選択する
- フラッターは、Navigationpushを介してTextField入力を別のウィジェットに渡します
- 追加アイテムをv-selectvuetifyで常に表示する方法
- Vuetify v-selectでオブジェクトを使用するにはどうすればよいですか?
- テキストフィールド入力を垂直方向に中央に配置するにはどうすればよいですか?
- (TextFieldからの)ユーザー入力を別のクラスに渡しますか?
- Vuetify v-select onchangeイベントは、現在ではなく以前に選択した値を返します
関連した質問
- Vuejsで背景色を変更するのに苦労している
- BorderBottomがビューの上部に追加ReactNative
- HTMLボタンが機能しません。何か問題がありますか?
- チェックボックスの値が増加または減少している間、それは1つのチェックボックスでのみ機能し、すべてのチェックボックスで機能するはずです(プレーンJavascripr)
- vuejs:小道具とイベントを動的コンポーネントに動的に渡す方法
- 関数angularjs内の変数値を更新できません
- Vueテストユーティリティウォッチテスト
- onclickが最初のクリックで起動しない(プレーンJavascriptでのみ回答)
- ESLint&Vue:次の場所での `$log`の使用を禁止するにはどうすればよいですか?
- Vuejs内からのLaravel8でのAJAXPOSTリクエストが405(メソッドはサポートされていません)エラーをスローするのはなぜですか?
あなたは使用することができます
menu-props
小道具:または、メニューを手動で配置する方法は次のとおりです。
CSS
更新されたCodepen