element-plus日期时间选择器加红点

Element Plus 是一个基于 Vue 3 的桌面端组件库，它为开发者提供了一套丰富的组件，其中包括日期时间选择器（Datetime Picker）。在 Element Plus 中，如果你想要为日期时间选择器添加一个红色的点来指示状态，你可以通过自定义的方式来实现。

以下是一个基本的示例，展示如何在 Element Plus 的日期时间选择器上添加一个红点：

<template>
  <el-date-picker
    v-model="value"
    value-format="yyyy-MM-dd HH:mm:ss"
    type="datetime"
    placeholder="选择日期时间"
  >
    <template v-slot:append>
      <div class="custom-dot" style="position: absolute; top: 10px; right: 10px; width: 8px; height: 8px; background-color: red; border-radius: 50%;"></div>
    </template>
  </el-date-picker>
</template>

<script>
export default {
  data() {
    return {
      value: '',
    };
  },
};
</script>

<style scoped>
.custom-dot {
  /* 自定义红点样式 */
}
</style>

在这个例子中，我们使用了 `<template v-slot:append>` 来添加一个自定义内容到日期时间选择器的右上角。然后，通过 CSS 样式定义了一个小圆点，并将其背景颜色设置为红色。你可以根据需要调整位置、大小和样式。

需要注意的是，Element Plus 的样式可能会随着版本更新而发生变化，因此请确保参考的文档和样式代码与你正在使用的版本相匹配。