diff --git a/src/configs/hotkey.ts b/src/configs/hotkey.ts index 7ae91902..cd32fb5c 100644 --- a/src/configs/hotkey.ts +++ b/src/configs/hotkey.ts @@ -55,8 +55,8 @@ export const HOTKEY_DOC = [ { label: '放大画布', value: 'Ctrl + =' }, { label: '缩小画布', value: 'Ctrl + -' }, { label: '缩放画布到合适大小', value: 'Ctrl + 0' }, - { label: '编辑上一页', value: '↑ / ←' }, - { label: '编辑下一页', value: '↓ / →' }, + { label: '编辑上一页', value: '↑ / ← / 鼠标上滚' }, + { label: '编辑下一页', value: '↓ / → / 鼠标下滚' }, ], }, { diff --git a/src/views/Editor/Canvas/index.vue b/src/views/Editor/Canvas/index.vue index b1d5ed5a..57b5c0f9 100644 --- a/src/views/Editor/Canvas/index.vue +++ b/src/views/Editor/Canvas/index.vue @@ -2,7 +2,7 @@
{ @@ -172,16 +175,24 @@ export default defineComponent({ if (editorAreaFocus.value) store.commit(MutationTypes.SET_EDITORAREA_FOCUS, false) } - // 按住Ctrl键滚动鼠标缩放画布 + // 滚动鼠标 const { scaleCanvas } = useScaleCanvas() const throttleScaleCanvas = throttle(scaleCanvas, 100, { leading: true, trailing: false }) + const throttleUpdateSlideIndex = throttle(updateSlideIndex, 300, { leading: true, trailing: false }) - const mousewheelScaleCanvas = (e: WheelEvent) => { - if (!ctrlKeyState.value) return - + const handleMousewheelCanvas = (e: WheelEvent) => { e.preventDefault() - if (e.deltaY > 0) throttleScaleCanvas('-') - else if (e.deltaY < 0) throttleScaleCanvas('+') + + // 按住Ctrl键时:缩放画布 + if (ctrlKeyState.value) { + if (e.deltaY > 0) throttleScaleCanvas('-') + else if (e.deltaY < 0) throttleScaleCanvas('+') + } + // 上下翻页 + else { + if (e.deltaY > 0) throttleUpdateSlideIndex(KEYS.DOWN) + else if (e.deltaY < 0) throttleUpdateSlideIndex(KEYS.UP) + } } // 开关网格线 @@ -247,7 +258,7 @@ export default defineComponent({ scaleElement, dragLineElement, scaleMultiElement, - mousewheelScaleCanvas, + handleMousewheelCanvas, contextmenus, } },