这个问题在uniapp中确实比较常见,尤其是在安卓设备上。以下是几种可能的解决方案:1.使用 keyboard-accessory 组件: 在 textarea 组件中添加 keyboard-accessory 组件,可以有效避免第一次聚焦失焦的问题。示例如下:HTML代码<textarea fixed maxlength="300" auto-height="true" :show-confirm-bar="false" @focus="onFocus" @blur="onBlur" v-model="commentText"> <keyboard-accessory style="height: 1px;"><cover-view style="background: transparent;"></cover-view></keyboard-accessory></textarea>延时聚焦: 在 mounted 或 created 生命周期钩子中,使用 setTimeout 延时聚焦,可以避免键盘弹出后立即失焦的问题:JavaScript代码mounted() { setTimeout(() => {this.$refs.textarea.focus();}, 100);}监听点击事件: 避免使用 focus 和 blur 事件,改用点击事件来控制键盘的显示和隐藏:HTML代码<div @click="showKeyboard"> <textarea ref="textarea" v-model="commentText"></textarea></div>JavaScript代码methods: { showKeyboard() {this.$refs.textarea.focus();}}这些方法可以帮助你解决 textarea 组件第一次聚焦失焦的问题。你可以根据具体情况选择最适合的方案进行尝试。
这个问题在uniapp中确实比较常见,尤其是在安卓设备上。以下是几种可能的解决方案:
1.使用 keyboard-accessory 组件: 在 textarea 组件中添加 keyboard-accessory 组件,可以有效避免第一次聚焦失焦的问题。示例如下:
HTML代码
<textarea fixed maxlength="300" auto-height="true" :show-confirm-bar="false" @focus="onFocus" @blur="onBlur" v-model="commentText">
<keyboard-accessory style="height: 1px;">
</keyboard-accessory>
</textarea>
JavaScript代码
mounted() {
setTimeout(() => {
}, 100);
}
HTML代码
<div @click="showKeyboard">
<textarea ref="textarea" v-model="commentText"></textarea>
</div>
JavaScript代码
methods: {
showKeyboard() {
}
}
这些方法可以帮助你解决 textarea 组件第一次聚焦失焦的问题。你可以根据具体情况选择最适合的方案进行尝试。