fix: 🐛 修复菜单搜索组件搜索结果项样式未绑定问题

This commit is contained in:
Ray.Hao
2025-03-02 22:47:43 +08:00
parent 7e7ca3a954
commit d278a3e53d

View File

@@ -32,7 +32,12 @@
<li <li
v-for="(item, index) in displayResults" v-for="(item, index) in displayResults"
:key="item.path" :key="item.path"
:class="{ 'search-result__item--active': index === activeIndex }" :class="[
'search-result__item',
{
'search-result__item--active': index === activeIndex,
},
]"
@click="navigateToRoute(item)" @click="navigateToRoute(item)"
> >
<el-icon v-if="item.icon && item.icon.startsWith('el-icon')"> <el-icon v-if="item.icon && item.icon.startsWith('el-icon')">
@@ -40,7 +45,7 @@
</el-icon> </el-icon>
<div v-else-if="item.icon" :class="`i-svg:${item.icon}`" /> <div v-else-if="item.icon" :class="`i-svg:${item.icon}`" />
<div v-else class="i-svg:menu" /> <div v-else class="i-svg:menu" />
{{ item.title }} <span class="ml-2">{{ item.title }}</span>
</li> </li>
</ul> </ul>
<el-empty v-else description="暂无数据" /> <el-empty v-else description="暂无数据" />
@@ -192,14 +197,15 @@ onMounted(() => {
} }
&__item { &__item {
display: flex;
align-items: center;
padding: 10px; padding: 10px;
line-height: 40px;
text-align: left; text-align: left;
cursor: pointer; cursor: pointer;
&--active { &--active {
color: $menu-active-text; color: var(--el-color-primary);
background-color: $menu-hover; background-color: var(--el-menu-hover-bg-color);
} }
} }
} }