fix(题目列表): 排序下拉框不再多出一根滚动条
Some checks failed
Deploy / deploy (push) Has been cancelled

原来那行 :dropdown-style 是无效的 —— NSelect 没有这个 prop(只有
menu-props),写了会当普通属性掉到根节点上。真正卡高度的是 naive-ui
InternalSelectMenu 主题里的 height: calc(var(--n-option-height) * 7.6),
作用在菜单内部的 .n-scrollbar 上。8 条排序项 280px 超出 258.4px 半条,
逼出一根只能滚 22px 的滚动条。

改走 theme-overrides,按选项条数算高度,以后加减排序项自动跟着走。

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01Sy3L9zJHiSNFyNC3ZbMwdj
This commit is contained in:
2026-09-03 20:13:01 -06:00
parent 37861800e0
commit 1729b9db4d

View File

@@ -47,6 +47,19 @@ const sortOptions = [
{ label: "语法检查", value: "ast" },
]
// naive-ui 下拉菜单默认只给 7.6 个选项的高度InternalSelectMenu 主题里的
// height: calc(var(--n-option-height) * 7.6)8 条排序正好多出半条,逼出一根
// 只能滚两像素的滚动条。按实际条数放开,+8px 是菜单自己的上下内边距。
// 注意NSelect 没有 dropdown-style 这个 prop写了会当普通属性掉到根节点上
// 不起作用;控制高度只能走 peers.InternalSelectMenu。
const sortMenuTheme = {
peers: {
InternalSelectMenu: {
height: `calc(var(--n-option-height) * ${sortOptions.length} + 8px)`,
},
},
}
const router = useRouter()
const userStore = useUserStore()
@@ -250,7 +263,7 @@ function rowProps(row: ProblemFiltered) {
style="width: 120px"
v-model:value="query.sort"
:options="sortOptions"
:dropdown-style="{ maxHeight: 'unset' }"
:theme-overrides="sortMenuTheme"
/>
</n-form-item>
<n-form-item>