Demo:增加是否自动进入文本编辑的配置

This commit is contained in:
街角小林 2024-10-24 09:35:52 +08:00
parent 1f23257917
commit 59950b2ba0
6 changed files with 29 additions and 5 deletions

View File

@ -113,6 +113,16 @@ export default class TextEdit {
) )
} }
} }
if (
opt.enableAutoEnterTextEditWhenKeydown !==
lastOpt.enableAutoEnterTextEditWhenKeydown
) {
window[
opt.enableAutoEnterTextEditWhenKeydown
? 'addEventListener'
: 'removeEventListener'
]('keydown', this.onKeydown)
}
}) })
} }

View File

@ -76,7 +76,8 @@ export default {
tagPosition: 'Node tag position', tagPosition: 'Node tag position',
tagPositionRight: 'Text right', tagPositionRight: 'Text right',
tagPositionBottom: 'Text bottom', tagPositionBottom: 'Text bottom',
alwaysShowExpandBtn: 'Always show expand btn' alwaysShowExpandBtn: 'Always show expand btn',
enableAutoEnterTextEditWhenKeydown: 'Auto enter text edit when keydown'
}, },
color: { color: {
moreColor: 'More color' moreColor: 'More color'

View File

@ -74,7 +74,8 @@ export default {
tagPosition: '节点标签显示的位置', tagPosition: '节点标签显示的位置',
tagPositionRight: '文本右侧', tagPositionRight: '文本右侧',
tagPositionBottom: '文本下面', tagPositionBottom: '文本下面',
alwaysShowExpandBtn: '是否一直显示展开收起按钮' alwaysShowExpandBtn: '是否一直显示展开收起按钮',
enableAutoEnterTextEditWhenKeydown: '键盘输入时自动进入文本编辑'
}, },
color: { color: {
moreColor: '更多颜色' moreColor: '更多颜色'

View File

@ -44,7 +44,8 @@ export default {
tagPosition: '節點標簽顯示的位置', tagPosition: '節點標簽顯示的位置',
tagPositionRight: '文本右側', tagPositionRight: '文本右側',
tagPositionBottom: '文本下面', tagPositionBottom: '文本下面',
alwaysShowExpandBtn: '是否壹直顯示展開收起按鈕' alwaysShowExpandBtn: '是否壹直顯示展開收起按鈕',
enableAutoEnterTextEditWhenKeydown: '鍵盤輸入時自動進入文本編輯'
}, },
setting: { setting: {
title: '設置', title: '設置',

View File

@ -368,11 +368,11 @@ export default {
} }
}, },
openRealtimeRenderOnNodeTextEdit: true, openRealtimeRenderOnNodeTextEdit: true,
enableAutoEnterTextEditWhenKeydown: true,
...(config || {}), ...(config || {}),
iconList: [...icon], iconList: [...icon],
useLeftKeySelectionRightKeyDrag: this.useLeftKeySelectionRightKeyDrag, useLeftKeySelectionRightKeyDrag: this.useLeftKeySelectionRightKeyDrag,
customInnerElsAppendTo: null, customInnerElsAppendTo: null,
enableAutoEnterTextEditWhenKeydown: true,
customHandleClipboardText: handleClipboardText, customHandleClipboardText: handleClipboardText,
defaultNodeImage: require('../../../assets/img/图片加载失败.svg'), defaultNodeImage: require('../../../assets/img/图片加载失败.svg'),
initRootNodePosition: ['center', 'center'], initRootNodePosition: ['center', 'center'],

View File

@ -209,6 +209,16 @@
> >
</div> </div>
</div> </div>
<!-- 是否在键盘输入时自动进入节点文本编辑模式 -->
<div class="row">
<div class="rowItem">
<el-checkbox
v-model="config.enableAutoEnterTextEditWhenKeydown"
@change="updateOtherConfig('enableAutoEnterTextEditWhenKeydown', $event)"
>{{ $t('setting.enableAutoEnterTextEditWhenKeydown') }}</el-checkbox
>
</div>
</div>
<!-- 是否开启手绘风格 --> <!-- 是否开启手绘风格 -->
<div class="row" v-if="supportHandDrawnLikeStyle"> <div class="row" v-if="supportHandDrawnLikeStyle">
<div class="rowItem"> <div class="rowItem">
@ -360,7 +370,8 @@ export default {
createNewNodeBehavior: 'default', createNewNodeBehavior: 'default',
tagPosition: 'right', tagPosition: 'right',
openRealtimeRenderOnNodeTextEdit: true, openRealtimeRenderOnNodeTextEdit: true,
alwaysShowExpandBtn: false alwaysShowExpandBtn: false,
enableAutoEnterTextEditWhenKeydown: true
}, },
watermarkConfig: { watermarkConfig: {
show: false, show: false,