el-color-picker指定默认颜色

由于公司需要对Element 的el-color-picker 有默认指定颜色，所以进行了以下修改这里记录一下，以下代码可以直接运行。
指定默认颜色效果图：

<template>
    <div class="content-picker">
       <h3>Color Picker指定默认颜色</h3>
        <el-color-picker
            popper-class="custom-color-picker"
            :predefine="predefineColors"
            v-model="background_color"
        ></el-color-picker>
    </div>
</template>

<script>
export default {
  data () {
    return {
      background_color: '#d87c7c',
      predefineColors: [
        '#d87c7c',
        '#919e8b',
        '#d7ab82',
        '#6e7074',
        '#d95850',
        '#73a373',
        '#73b9bc',
        '#eb8146',
        '#ffb248',
        '#f2d643'
      ]
    }
  },
  created () {

  },
  methods: {

  }
}
</script>

<style lang="less">
.content-picker{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin-top: 50px;
}
.custom-color-picker {
  .el-color-predefine {
    width: 300px !important;
  }
  .el-input__inner,
  .el-color-dropdown__link-btn,
  .el-color-dropdown__main-wrapper {
    display: none !important;
  }
  .el-color-predefine__color-selector {
    margin: 8px 10px !important;
    height: 40px !important;
    width: 40px !important;
  }
}
</style>

以上就是我对el-color-picker的一点使用,如果文章由于我学识浅薄,导致您发现有严重谬误的地方,请一定在评论中指出,我会在第一时间修正我的文章,以避免误人子弟。