fix: 表格单元格编辑优化,处理Firefox下无法编辑的问题(#209)

This commit is contained in:
pipipi-pikachu 2023-07-08 18:59:51 +08:00
parent 62c21928c1
commit 22169b9bff

View File

@ -2,15 +2,16 @@
<div <div
class="custom-textarea" class="custom-textarea"
ref="textareaRef" ref="textareaRef"
@focus="handleFocus" :contenteditable="true"
@blur="handleBlur" @focus="handleFocus()"
@blur="handleBlur()"
@input="handleInput()" @input="handleInput()"
v-html="text" v-html="text"
></div> ></div>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import { onUnmounted, ref, watch } from 'vue' import { onBeforeUnmount, ref, watch } from 'vue'
import { pasteCustomClipboardString, pasteExcelClipboardString } from '@/utils/clipboard' import { pasteCustomClipboardString, pasteExcelClipboardString } from '@/utils/clipboard'
const props = defineProps({ const props = defineProps({
@ -18,10 +19,6 @@ const props = defineProps({
type: String, type: String,
default: '', default: '',
}, },
contenteditable: {
type: [Boolean, String],
default: false,
},
}) })
const emit = defineEmits<{ const emit = defineEmits<{
@ -70,7 +67,6 @@ const handleFocus = () => {
return return
} }
emit('updateValue', text)
document.execCommand('insertText', false, text) document.execCommand('insertText', false, text)
}) })
} }
@ -84,7 +80,7 @@ const handleBlur = () => {
} }
// //
onUnmounted(() => { onBeforeUnmount(() => {
if (textareaRef.value) textareaRef.value.onpaste = null if (textareaRef.value) textareaRef.value.onpaste = null
}) })
</script> </script>
@ -94,6 +90,5 @@ onUnmounted(() => {
border: 0; border: 0;
outline: 0; outline: 0;
-webkit-user-modify: read-write-plaintext-only; -webkit-user-modify: read-write-plaintext-only;
-moz-user-modify: read-write-plaintext-only;
} }
</style> </style>