底部工具栏的子选项锚点 ref 改用查表

- src/components/image-editor/ImageCanvasBottomToolbarView.tsx:把 spec / music / model3d / publication 的三层三元 ref 选择链提成 toolWrapRefs 映射表,新增子选项时不再延长三元链

验证:npx vitest run src/components/image-editor/ImageCanvasBottomToolbarView.test.tsx(3 用例全绿)、npm run typecheck
This commit is contained in:
2026-09-22 13:31:46 +08:00
parent 4363a6219a
commit b41d156edd
@@ -100,6 +100,17 @@ export function ImageCanvasBottomToolbarView({
onOpenToolOptions,
onCloseToolOptions,
}: ImageCanvasBottomToolbarViewProps) {
// 每个可展开子选项挂在自己那一格上的定位锚点:查表比三层三元链更好加新工具。
const toolWrapRefs: Record<
ToolbarOptionTool,
RefObject<HTMLSpanElement | null>
> = {
spec: specToolWrapRef,
music: musicToolWrapRef,
model3d: model3dToolWrapRef,
publication: publicationToolWrapRef,
};
return (
<CanvasToolbar
className={[
@@ -118,15 +129,7 @@ export function ImageCanvasBottomToolbarView({
<CanvasToolbarGroup key={id}>
{separatorBefore ? <CanvasToolbarDivider /> : null}
<span
ref={
id === 'spec'
? specToolWrapRef
: id === 'music'
? musicToolWrapRef
: id === 'model3d'
? model3dToolWrapRef
: publicationToolWrapRef
}
ref={toolWrapRefs[id]}
className={[
'image-canvas-editor__bottom-toolbar-option-wrap',
id === 'spec' ? 'image-canvas-editor__spec-tool-wrap' : '',