快捷键
在表单设计过程中,快捷键的使用可以大幅提高效率,帮助您快速完成常规操作。设计器中内置了一系列实用的快捷键,本文将详细介绍这些快捷键的使用方法。

快捷键操作
以下是目前支持的快捷键操作及其作用:
基础操作
功能 | 快捷键 | 作用说明 |
---|---|---|
复制规则 | Command/Ctrl + c | 复制当前选中组件的配置规则,便于快速复用相同配置组件。 |
剪切规则 | Command/Ctrl + x | 移除当前选中组件的配置规则并存入剪贴板,支持粘贴到其他位置。 |
粘贴规则 | Command/Ctrl + v | 将剪贴板中的配置规则粘贴到目标容器或表单末尾。 |
删除规则 | Command/Ctrl + Shift + Delete | 删除当前选中组件及其配置规则。 |
撤销操作 | Command/Ctrl + z | 回退到上一步操作状态,支持多级撤销(如删除、移动、配置修改等)。 |
重做操作 | Command/Ctrl + Shift + z | 恢复最近一次撤销的操作,与撤销功能配套使用。 |
布局调整
功能 | 快捷键 | 作用说明 |
---|---|---|
向上移动组件 | Command/Ctrl + ↑ | 将选中组件在表单容器中上移一位。 |
向下移动组件 | Command/Ctrl + ↓ | 将选中组件在表单容器中下移一位。 |
视图与面板
功能 | 快捷键 | 作用说明 |
---|---|---|
打印/预览表单 | Command/Ctrl + p | 打开表单打印预览窗口,支持调整排版或导出为PDF。 |
打开组件列表面板 | Command/Ctrl + 1 | 显示所有可拖拽组件的分类列表。 |
打开字段列表面板 | Command/Ctrl + 2 | 展示当前表单所有字段的树形结构,支持快速跳转编辑字段属性。 |
打开大纲面板 | Command/Ctrl + 3 | 显示表单层级结构缩略图,便于快速定位嵌套组件或复杂布局。 |
打开JSON预览面板 | Command/Ctrl + 4 | 实时查看表单配置的JSON数据,支持直接编辑并同步到表单。 |
打开多语言配置面板 | Command/Ctrl + 5 | 配置表单标签、提示等文本的多语言映射。 |
打开全局配置面板 | Command/Ctrl + 6 | 管理表单全局数据。 |
打开弹窗管理面板 | Command/Ctrl + 7 | 管理表单中嵌套的弹窗组件。 |
切换弹窗 | Command/Ctrl + Shift + [0-9] | 快速切换至指定序号(0-9)的弹窗编辑界面。 |
关闭快捷键
如果您希望暂时不使用快捷键功能,可以通过设置 config.hotKey = false
来关闭这个功能。
vue
<template>
<fc-designer ref="designer" :config="config"/>
</template>
<script setup>
const config = {
hotKey: false // 关闭快捷键
}
</script>
通过对快捷键的有效利用,您不仅能够提升设计效率,还可以确保表单设计流程的流畅性和准确性。希望本指南能够帮助您在使用表单设计器时更加得心应手。