data() { return { headers: [ { text: "ColA", value: "cola", width: "10%" }, { text: "ColB", value: "colb", width: "80%" }, { text: "ColC", value: "cols", width: "10%" }, ], } }
利用規約などスクロールが必要なコンテンツをv-dialogに書くと、スクロール位置がリセットされない件に対応してみました(Vuetify v1.5対応) まずはこちらに対応したv-dialogを用意 https://scrapbox.io/gyarasu/Vuetify%E3%81%AEv-dialog%E5%86%85%E3%81%A7%E3%82%B9%E3%82%AF%E3%83%AD%E3%83%BC%E3%83%AB%E4%BD%8D%E7%BD%AE%E3%82%92%E5%8F%96%E5%BE%97%E3%81%99%E3%82%8B dialogコンポーネントが開いた後に実行するメソッドなどに下記の方法でscrollTopを指定すればスクロール位置がリセットされます。 let i = document.getElementById('scroll-target') i.a
なにこれ 最近Vue.jsのマテリアルデザインのUIフレームワーク「Vuetify」を使っています。 とても便利で、管理アプリのようにデザインにこだわる必要がなければ、CSSをほとんど書かずに済むくらいコンポーネントが充実しています。 ただSelectタグでlabelとvalueを出しわける際に初期値を設定する場合は少しだけ注意点があるので、この記事ではそちらを紹介します。 return-objectを使いましょう Selectタグでlabelとvalueを出しわけるときに初期値を設定する場合、v-modelで設定します。 以下のような実装です。 <template> <div> {{ selectedPlan }} <v-select v-model="selectedPlan" item-text="label" item-value="value" :items="plans" la
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く