Element UI 颜色选择器组件 (el-color-picker) 赋值文本教程

<template>
  <div>
    <el-color-picker v-model='color'></el-color-picker>
    <p>当前颜色值为：{{ color }}</p>
  </div>
</template>
<script>
export default {
  data() {
    return {
      color: '',
    };
  },
};
</script>
<p>在上述示例中，el-color-picker组件的v-model绑定了color变量，所以当用户选择一个颜色后，color变量的值就会更新，同时页面上的文本‘当前颜色值为：{{ color }}’也会随之更新，反映出当前选择的颜色值。</p>