- 最近在做个客服系统的微信小程序,使用到了发送消息后,input要保持获取焦点,并且软键盘不收回,这就很像微信那样
- 话不多说,直接上代码
<template>
<!-- 输入框 -->
<input
type="text"
placeholder="输入你的问题"
v-model="keyword"
:focus="focus"
@blur="handleBlur"
@click="editorTap"
:always-embed="true"
v-if="!isRecording"
:hold-keyboard="true"
ref="text_input"
:adjust-position="false"
/>
<!-- 发送按钮 -->
<view class="item send">
<button size="mini" @click="sendMessage" v-show="isShow" >发送</button>
</view>
</template>
<script>
export default {
data(){
focus: false,
},
methods:{
// 发送消息
sendMessage() {
if(!this.keyword.trim()) {
return
};
//发送消息的业务逻辑
this.$emit('sendUserMessage', {
text: this.keyword,
type: 'text'
});
this.keyword = '';
//发送消息之后立马获取到焦点
this.focus = true;
},
handleBlur(e) {
this.focus = false;
},
}
}
</script>