Commit e391c61e authored by 罗超's avatar 罗超

新增文本框双击事件,双击选中当前文本

parent 3a65d394
...@@ -95,7 +95,8 @@ watch(() => props.editable, () => { ...@@ -95,7 +95,8 @@ watch(() => props.editable, () => {
// 暴露 focus 方法 // 暴露 focus 方法
const focus = () => editorView.focus() const focus = () => editorView.focus()
defineExpose({ focus }) const selectAll = () => autoSelectAll(editorView)
defineExpose({ focus,selectAll })
// 执行富文本命令(可以是一个或多个) // 执行富文本命令(可以是一个或多个)
// 部分命令在执行前先判断当前选区是否为空,如果选区为空先进行全选操作 // 部分命令在执行前先判断当前选区是否为空,如果选区为空先进行全选操作
......
...@@ -52,11 +52,12 @@ ...@@ -52,11 +52,12 @@
}" }"
@update="value => updateContent(value)" @update="value => updateContent(value)"
@mousedown="$event => handleSelectElement($event, false)" @mousedown="$event => handleSelectElement($event, false)"
ref="editorRef"
/> />
<!-- 当字号过大且行高较小时,会出现文字高度溢出的情况,导致拖拽区域无法被选中,因此添加了以下节点避免该情况 --> <!-- 当字号过大且行高较小时,会出现文字高度溢出的情况,导致拖拽区域无法被选中,因此添加了以下节点避免该情况 -->
<div class="drag-handler top"></div> <div class="drag-handler top" @dblclick="setEditorHandler"></div>
<div class="drag-handler bottom"></div> <div class="drag-handler bottom" @dblclick="setEditorHandler"></div>
</div> </div>
</div> </div>
</div> </div>
...@@ -88,6 +89,7 @@ const { handleElementId, isScaling } = storeToRefs(mainStore) ...@@ -88,6 +89,7 @@ const { handleElementId, isScaling } = storeToRefs(mainStore)
const { addHistorySnapshot } = useHistorySnapshot() const { addHistorySnapshot } = useHistorySnapshot()
const elementRef = ref<HTMLElement>() const elementRef = ref<HTMLElement>()
const editorRef = ref()
const shadow = computed(() => props.elementInfo.shadow) const shadow = computed(() => props.elementInfo.shadow)
const { shadowStyle } = useElementShadow(shadow) const { shadowStyle } = useElementShadow(shadow)
...@@ -170,6 +172,11 @@ const updateContent = (content: string) => { ...@@ -170,6 +172,11 @@ const updateContent = (content: string) => {
addHistorySnapshot() addHistorySnapshot()
} }
const setEditorHandler = ()=>{
editorRef.value?.focus()
editorRef.value?.selectAll()
}
const checkEmptyText = debounce(function() { const checkEmptyText = debounce(function() {
const pureText = props.elementInfo.content.replaceAll(/<[^>]+>/g, '') const pureText = props.elementInfo.content.replaceAll(/<[^>]+>/g, '')
if (!pureText) slidesStore.deleteElement(props.elementInfo.id) if (!pureText) slidesStore.deleteElement(props.elementInfo.id)
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment