docs: 编写 color-picker 文档
This commit is contained in:
parent
d64fdd71e6
commit
ffecfa43a4
@ -7,13 +7,46 @@
|
|||||||
::: demo
|
::: demo
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<lay-color-picker></lay-color-picker>
|
<lay-color-picker v-model="color"></lay-color-picker>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
|
import { ref } from "vue";
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
setup() {
|
setup() {
|
||||||
|
const color = ref("#009688");
|
||||||
|
|
||||||
return {
|
return {
|
||||||
|
color
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
:::
|
||||||
|
|
||||||
|
::: title 预设颜色
|
||||||
|
:::
|
||||||
|
|
||||||
|
::: demo
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<lay-color-picker v-model="color" :preset="preset"></lay-color-picker>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import { ref } from "vue";
|
||||||
|
|
||||||
|
export default {
|
||||||
|
setup() {
|
||||||
|
const color = ref("#009688");
|
||||||
|
|
||||||
|
const preset = ref(["#009688", "#1e9fff", "#ffb800", "#ff5722", "#5fb878"])
|
||||||
|
|
||||||
|
return {
|
||||||
|
color,
|
||||||
|
preset
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -28,9 +61,8 @@ export default {
|
|||||||
|
|
||||||
| | | |
|
| | | |
|
||||||
| ---------- | -------- | --- |
|
| ---------- | -------- | --- |
|
||||||
| v-model | 默认值 | -- |
|
| v-model | 选中色 | -- |
|
||||||
| page | 开启分页 | -- |
|
| preset | 预设颜色 | -- |
|
||||||
| showSearch | 启用搜索 | -- |
|
|
||||||
|
|
||||||
:::
|
:::
|
||||||
|
|
||||||
|
@ -109,7 +109,7 @@ export interface LayColorPicker {
|
|||||||
}
|
}
|
||||||
|
|
||||||
const props = withDefaults(defineProps<LayColorPicker>(), {
|
const props = withDefaults(defineProps<LayColorPicker>(), {
|
||||||
modelValue: { r: 217, g: 128, b: 95, a: 1 },
|
modelValue: { r: 255, g: 255, b: 255, a: 1 },
|
||||||
preset: ["#009688", "#1e9fff", "#ffb800", "#ff5722", "#5fb878"],
|
preset: ["#009688", "#1e9fff", "#ffb800", "#ff5722", "#5fb878"],
|
||||||
});
|
});
|
||||||
|
|
||||||
|
Loading…
x
Reference in New Issue
Block a user