vue vxe-color-picker 颜色选择器,启用取色管功能,选取页面内任意颜色

vue vxe-color-picker 颜色选择器,启用取色管功能,选取页面内任意颜色

官网:https://vxeui.com

github:https://github.com/x-extends/vxe-pc-ui

gitee:https://gitee.com/x-extends/vxe-pc-ui

参数 show-eye-dropper 用于启用取色管功能,需要注意的是指支持谷歌浏览器。

html 复制代码
<template>
  <div>
    <vxe-color-picker v-model="val1" show-eye-dropper clearable></vxe-color-picker>
    <vxe-color-picker v-model="val2" :colors="colorList" show-eye-dropper clearable></vxe-color-picker>
  </div>
</template>

<script lang="ts" setup>
import { ref } from 'vue'

const val1 = ref('')
const val2 = ref('#FF00FF')

const colorList = ref([
  '#DC143C', '#FF1493', '#FF00FF', '#9932CC', '#6A5ACD',
  '#0000FF', '#00008B', '#778899', '#1E90FF', '#00BFFF',
  '#5F9EA0', '#00FFFF', '#008080', '#7FFFAA', '#3CB371',
  '#8FBC8F', '#008000', '#7CFC00', '#556B2F', '#FFFFE0',
  '#FFFF00', '#808000', '#EEE8AA', '#FFD700', '#FFA500',
  '#FF4500', '#FA8072', '#FF0000', '#800000', '#C0C0C0'
])
</script>

https://gitee.com/x-extends/vxe-pc-ui

相关推荐
雲墨款哥26 分钟前
Vue3.0 项目初始化及 Element Plus 配置实战
前端·vue.js
前端小饭桌30 分钟前
关于 Vue 3 的 ref,这些细节你了解了多少?
前端·vue.js
光影少年1 小时前
vue3.0性能提升主要通过那几方面体现的?
前端·vue.js
江城开朗的豌豆1 小时前
路由守卫:你的Vue路由‘保安’,全局把关还是局部盯梢?
前端·javascript·vue.js
Jinxiansen02111 小时前
Vue 3 响应式核心源码详解(基于 @vue/reactivity)
前端·javascript·vue.js
清幽竹客9 小时前
vue-30(理解 Nuxt.js 目录结构)
前端·javascript·vue.js
知性的小mahua9 小时前
echarts+vue实现中国地图板块渲染+省市区跳转渲染
vue.js
weiweiweb8889 小时前
cesium加载Draco几何压缩数据
前端·javascript·vue.js
满楼、9 天前
el-cascader 设置可以手动输入也可以下拉选择
javascript·vue.js·elementui
前端fighter9 天前
Vuex 与 Pinia:全面解析现代 Vue 状态管理的进化之路
前端·vue.js·面试