实现效果如下:
代码如下:
<el-dropdown trigger="click" @command="handleCommand" active-text-color="#606266">
<span class="product-card">{{
getCategoryName(categoryId)
}}</span>
<el-dropdown-menu slot="dropdown">
<template v-for="(item, index) in categories">
<el-dropdown-item
class="xlcdList"
:style="
item.id == categoryId
? 'color: #606266; background-color: #ecf5ff;'
: ''
"
:key="index"
:command="item.id"
>{{ item.categoryName }}</el-dropdown-item
>
</template>
</el-dropdown-menu>
</el-dropdown>
.el-dropdown-menu {
background-color: #478068;
}
.xlcdList {
background-color: #478068;
color: white;
&:hover {
// background-color: #478068;
color: #606266;
}
}