Element Plus 的 ColorPicker 颜色选择器：定制按钮

 截止至 饿了么 Element Plus 2.8.1版本的组件库，color picker组件不支持自定义颜色选择弹窗里的按钮！！！只好另辟蹊径解决这个问题。

<template>
    <div class="color_box flex between">
        <el-color-picker
            ref="colorPickerRef"
            :popper-class="'color_box_popper ' + randomClass"
            v-model="modelValue"
            color-format="hex"
            :showAlpha="showAlpha"
            :predefine="predefineColors"
            @focus="isOpen = true"
            @blur="isOpen = false"
            @active-change="realTimeChange"
        />
        <vk-icon
            v-if="hasEyeDropper && props.showEyeDropper"
            class="eyedropper flex"
            icon="&#xe13a;"
            size="20"
            @click="eyeDropper"
        ></vk-icon>
        <Teleport :to="`.${randomClass} .el-color-dropdown__btns`">
            <el-button size="small" class="teleport_button" @click="clearColor">
                {{ $t("Editor.Button.Clear") }}
            </el-button>
        </Teleport>
    </div>
</template>

const randomClass = ref("random-" + Math.random().toString(36).substring(2));

<style lang="scss">
.color_box_popper {
    .el-color-predefine__color-selector > div {
        border: 1px solid #c3c3c38d !important;
    }
    .el-button:not(.teleport_button) {
        display: none;
    }
}
</style>