Vue.jsでinputタグを表示せずに任意のボタン押下でファイル選択DLGを表示させる - Qiita
はじめに vue.jsに限ったことではありませんが、UIフレームワークを使用していて、標準のinputタグを配置すると見た目が統一できない（ブラウザによって変わる、UIフレームワークの見た目と統一性がない)点が気になるかと思います。 そこでinputタグを直接使用せずにファイルの選択ダイアログを表示させます。 左：通常のinputタグを用いた場合 右：inputタグを用いない場合 コード ※vuetifyを使用していますが、(v-xタグ)今回の説明と直接は関係は関係ありません。 他のフレームワークの場合、v-btnはそのフレームワーク等のボタンに置き換えてください。 <template> <v-container> // 非表示のinputタグを格納 <input style="display: none" ref="input" type="file" accept="image/jpe
【Vuetify】これだけ見れば済む色の設定方法まとめ - Qiita
概要 Vuetifyでの色の指定方法は様々あります。コンポーネントのテーマ色・背景色・文字色などによって、指定方法が異なることがあります。細かい所を忘れがちなので、この記事を見れば全て思い出せるようにまとめます。 プロジェクト全体で一貫性を持って、適切に色の指定を運用すると、メンテナンス性・可読性がかなり上がるのでおすすめです。 TL;DR 忘れやすい文字による指定方法だけまとめると以下 <!-- コンポーネントテーマカラー --> <!-- テーマカラーとVuetifyカラーリストがいける --> <v-btn color="primary">...</v-btn> <v-btn color="red darken-1">...</v-btn> <v-btn color="mycolor lighten-1">...</v-btn> <!-- VuetifyカラーリストにないCSSのカラ
Vuetify を使って困ったところ小ネタ集 - Neo's World
Vuetify を使って困ったところ小ネタ集 Vue CLI + TypeScript + SCSS + Vue-Router + Vuex なプロジェクトに、$ vue add vuetify で Vuetify を追加した。 Vuetify はマテリアルデザインを実現するフレームワークだが、細かなところでデザインを調整したい時に上手いやり方が分からないことがあり、ちょくちょく調べている。 今回はそんな、「ちょっとググッて調整した Vuetify 周りの小ネタ」を紹介する。 目次 Overlays 表示時に縦スクロールバーが消えて画面幅がズレるのがウザい scrollable な v-dialog の縦スクロールバーが見えたり消えたりするのがウザい v-list-item で省略せず折り返し表示させたい ページヘッダのタイトルにリンクを貼る v-text-field に required
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Vuetifyのv-btnのアルファベットが大文字になるのを抑制する - Qiita
要素サイズの指定 (height, width, class="h-* w-*")
vuetifyの画面の上下左右にコンポーネントをレイアウトしたい時のコンポーネント - Qiita
Vuetify v-iconが表示されない - Qiita