fix: 输入框优化已经文章问题修复
This commit is contained in:
parent
027b6555dd
commit
76b2187a64
@ -1,5 +1,5 @@
|
|||||||
<template>
|
<template>
|
||||||
<full-page :customScroll="true" pageStyle="background:#fff">
|
<full-page pageStyle="background:#fff">
|
||||||
<view v-if="loading" class="loading-container">
|
<view v-if="loading" class="loading-container">
|
||||||
<uni-icons type="spinner-cycle" size="40" color="#999" />
|
<uni-icons type="spinner-cycle" size="40" color="#999" />
|
||||||
<text class="loading-text">加载中...</text>
|
<text class="loading-text">加载中...</text>
|
||||||
|
|||||||
@ -17,7 +17,8 @@
|
|||||||
<!-- :hold-keyboard="true" -->
|
<!-- :hold-keyboard="true" -->
|
||||||
<textarea v-if="!showVoiceInput" class="text-input" v-model="inputText" placeholder="我来说两句..."
|
<textarea v-if="!showVoiceInput" class="text-input" v-model="inputText" placeholder="我来说两句..."
|
||||||
@confirm="sendTextMessage" @focus="handleInputFocus" @input="handleInput" :auto-height="true"
|
@confirm="sendTextMessage" @focus="handleInputFocus" @input="handleInput" :auto-height="true"
|
||||||
:show-confirm-bar="false" :maxlength="-1" :cursor-spacing="40" :focus="normalTextareaFocus" ref="textareaRef" />
|
:show-confirm-bar="false" :maxlength="-1" :cursor-spacing="40" :focus="normalTextareaFocus"
|
||||||
|
:cursor="inputCursor" ref="textareaRef" />
|
||||||
<input v-else class="voice-input-btn" :class="{ recording: isRecording }" @touchstart="startRecord"
|
<input v-else class="voice-input-btn" :class="{ recording: isRecording }" @touchstart="startRecord"
|
||||||
@touchmove="onRecordTouchMove" @touchend="stopRecord" @touchcancel="cancelRecord"
|
@touchmove="onRecordTouchMove" @touchend="stopRecord" @touchcancel="cancelRecord"
|
||||||
:placeholder="isRecording ? '松开发送' : '按住说话'" disabled />
|
:placeholder="isRecording ? '松开发送' : '按住说话'" disabled />
|
||||||
@ -40,7 +41,8 @@
|
|||||||
</view>
|
</view>
|
||||||
<textarea class="expanded-text-input" v-model="inputText" placeholder="我来说两句..."
|
<textarea class="expanded-text-input" v-model="inputText" placeholder="我来说两句..."
|
||||||
@confirm="sendTextMessage" @focus="handleInputFocus" @input="handleInput" :auto-height="false"
|
@confirm="sendTextMessage" @focus="handleInputFocus" @input="handleInput" :auto-height="false"
|
||||||
:show-confirm-bar="false" :maxlength="-1" :cursor-spacing="40" :focus="expandedTextareaFocus" />
|
:show-confirm-bar="false" :maxlength="-1" :cursor-spacing="40" :focus="expandedTextareaFocus"
|
||||||
|
:cursor="inputCursor" />
|
||||||
</view>
|
</view>
|
||||||
<view class="more-panel" v-if="showMorePanel">
|
<view class="more-panel" v-if="showMorePanel">
|
||||||
<view v-for="btn in morePanelButtons" :key="btn.text" class="more-btn" @click="btn.action">
|
<view v-for="btn in morePanelButtons" :key="btn.text" class="more-btn" @click="btn.action">
|
||||||
@ -126,6 +128,8 @@ const isInputOverFourLines = ref(false);
|
|||||||
const singleLineInputHeight = ref(0);
|
const singleLineInputHeight = ref(0);
|
||||||
const normalTextareaFocus = ref(false);
|
const normalTextareaFocus = ref(false);
|
||||||
const expandedTextareaFocus = ref(false);
|
const expandedTextareaFocus = ref(false);
|
||||||
|
const inputCursor = ref(-1);
|
||||||
|
let lastInputLength = 0;
|
||||||
const instanceProxy = getCurrentInstance()?.proxy;
|
const instanceProxy = getCurrentInstance()?.proxy;
|
||||||
const showExpandButton = computed(() => !showVoiceInput.value && isInputOverFourLines.value && !isInputExpanded.value);
|
const showExpandButton = computed(() => !showVoiceInput.value && isInputOverFourLines.value && !isInputExpanded.value);
|
||||||
const cloudCustomData = computed(() => {
|
const cloudCustomData = computed(() => {
|
||||||
@ -188,7 +192,10 @@ const collapseInput = () => {
|
|||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
watch(inputText, updateInputLines);
|
watch(inputText, (value) => {
|
||||||
|
lastInputLength = value.length;
|
||||||
|
updateInputLines();
|
||||||
|
});
|
||||||
|
|
||||||
// 录音相关扩展状态(特效 + 取消逻辑)
|
// 录音相关扩展状态(特效 + 取消逻辑)
|
||||||
const recordingDuration = ref(0);
|
const recordingDuration = ref(0);
|
||||||
@ -662,6 +669,19 @@ function handleInputFocus() {
|
|||||||
}
|
}
|
||||||
|
|
||||||
function handleInput(e) {
|
function handleInput(e) {
|
||||||
|
const value = e?.detail?.value || "";
|
||||||
|
const cursor = e?.detail?.cursor;
|
||||||
|
const isPastedText = value.length > lastInputLength + 1;
|
||||||
|
|
||||||
|
if (isPastedText && Number.isInteger(cursor)) {
|
||||||
|
nextTick(() => {
|
||||||
|
inputCursor.value = -1;
|
||||||
|
nextTick(() => {
|
||||||
|
inputCursor.value = cursor;
|
||||||
|
});
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
nextTick().then(() => {
|
nextTick().then(() => {
|
||||||
emit("scrollToBottom");
|
emit("scrollToBottom");
|
||||||
});
|
});
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user