颜色选择器

v-color-picker 允许你使用各种方法来选择颜色。

使用

API

组件	描述
v-color-picker	主要组件

示例

属性

自定义颜色选择器外观

大量的可用属性用于自定义此组件，显示或隐藏颜色选择器的特定部分。你可以隐藏调色盘，颜色滑块，或者输入框。甚至可以添加某些预置色板。

强调效果

可以通过修改 v-color-picker 组件的 elevation 或者 flat 属性调整强调效果。flat 等同于把 elevation 设置为 0。

颜色模式

你可以使用 modes 属性决定用户如何键入颜色值。如果你只设定一种颜色模式，那么会隐藏颜色模式选择框。你也可以使用 mode 的 v-model 来控制当前的颜色模式。

颜色模型

v-color-picker 使用 v-model 属性来控制显示的颜色。它支持十六进制字符串，如 #FF00FF 和 #FF00FF00 ，以及表示 RGBA 、HSLA 和 HSVA 值的对象。该组件将尝试以提供的相同格式发出颜色。如果值为null，那么 v-color-picker 将默认输出十六进制颜色。

色板

使用 show-swatches 属性，您可以显示用户可以从中选择的颜色样本数组。也可以使用 swatches 属性自定义显示的颜色。这个属性接受一个二维数组，其中第一个维度定义一列，第二个维度通过提供rgba十六进制字符串自顶向下定义样本。你也可以用 swatches-max-height 属性设置颜色样本区域的最大高度。