【vue elementUI】修改el-dropdown样式

在Vue中使用Element UI的el-dropdown组件时，你可以通过覆盖其默认样式来修改样式。以下是一个简单的例子，展示了如何通过自定义类来修改el-dropdown的样式。

1. 首先，定义一个自定义类：

.custom-dropdown {
  /* 修改样式 */
  color: red;
  /* 其他样式 */
}

2. 在Vue模板中，使用el-dropdown组件并应用自定义类：

<template>
  <el-dropdown class="custom-dropdown">
    <span>下拉菜单</span>
    <el-dropdown-menu slot="dropdown">
      <el-dropdown-item>黄金糕</el-dropdown-item>
      <el-dropdown-item>狮子头</el-dropdown-item>
      <el-dropdown-item>螺蛳粉</el-dropdown-item>
      <el-dropdown-item>牛肉面</el-dropdown-item>
    </el-dropdown-menu>
  </el-dropdown>
</template>
 
<script>
export default {
  // 你的组件逻辑
};
</script>
 
<style>
.custom-dropdown {
  color: red; /* 修改样式 */
}
</style>

在这个例子中，.custom-dropdown类被应用到el-dropdown组件上，并且设置了颜色为红色。你可以根据需要修改这个类中的任何CSS属性来调整el-dropdown的外观。