Vuetify

ショップ

企業向け

v-color-pickerを使用すると、さまざまな入力方法を使用して色を選択できます。

Options

確認したいコンポーネントを下から選び、利用できる props、slots、events、functions を確認してください。

以下に、簡単な例から複雑な例まで示します。

v-color-pickerv-modelpropを使用して表示される色を制御します。 #FF00FFおよび#FF00FF00などの16進文字列、およびRGBAHSLAおよびHSVA値を表すオブジェクトをサポートします。

Adjust the elevation of the v-color-picker component using the elevation or flat prop. The flat is equivalent to setting elevation to 0.

show-swatches propを使用すると、ユーザーが選択できる色見本の配列を表示できます。 swatches プロパティを使用して、表示する色をカスタマイズすることもできます。このpropは2次元配列を受け入れます。1次元目は列を定義し、2次元目にrgba 16進文字列を提供することで上から下にスウォッチを定義します。 swatches-max-height プロパティを使用して、スウォッチセクションの最大高さを設定することもできます。

ナンバー入力は、 hide-inputs propで非表示にできます。 hide-mode-switch propでモード切り替えアイコンを非表示にすることもできます。モードは、 mode propを介して外部から制御することもできます。

キャンバスはhide-canvas propで非表示にでき、その高さはcanvas-height propで設定できます。選択ドットのサイズは、dot-size propで制御できます。

準備はいいですか? 以下から続きが読めます。

Caught a mistake or want to contribute to the documentation? Edit Layout on GitHub!