修改

pagesC/seekadvicefrom/seekadvicefrom.vue

@@ -1,5 +1,5 @@
 <template>
-	<view class="content" :style="{'padding-bottom': bottomVal }">
+	<view class="content">
 		<!-- <view class="title">
 			<image src="../../static/huijiantou.png" @click="back"></image>
 			{{currentItem.senderName}}
@@ -34,9 +34,9 @@
 				<!-- <view class="placeholder" id="placeholder" v-if="showFunBtn"></view> -->
 			</view>
 		</scroll-view>
-
 		<!-- 底部输入 -->
-		<view class="input-box" :class="{ 'input-box-mpInputMargin': mpInputMargin }">
+		<view class="input-box" :class="{ 'input-box-mpInputMargin': mpInputMargin }"
+			:style="{'padding-bottom':bottomVal+'px'}">
 			<view class="input-box-flex">
 				<!--弹出常用 -->
 				<!-- <image class="icon_img" :src="require('@/static/ico/often.png')" @tap="oftenx"></image> -->
@@ -44,7 +44,7 @@
 				<view class="input-box-flex-grow"> <input type="text" class="contenxxt" id="input"
 						v-model="formData.content" :hold-keyboard="true" :confirm-type="'send'" :confirm-hold="true"
 						placeholder-style="color:#DDDDDD;" :cursor-spacing="10" @confirm='sendconfirm'
-						@focus="inputBindFocus" @blur="inputBindBlur" /> </view>
+						:adjust-position="false" @keyboardheightchange="keyboardheightchange" /> </view>
 				<!-- 选择表情包 -->
 				<!-- <image class=" icon_btn_add" :src="require('@/static/ico/emoji.png')" @tap="exprec"></image> -->
 				<!-- 发送消息按钮 -->
@@ -181,14 +181,22 @@
 			// })
 		},
 		methods: {
-			inputBindFocus(e) {
+			keyboardheightchange(event) {
-				this.bottomVal = e.detail.height + 'px'
+				const {
-				// 获取手机键盘的高度，赋值给input 所在盒子的 bottom 值
+					height,
-				// 注意!!! 这里的 px 至关重要!!! 我搜到的很多解决方案都没有说这里要添加 px
+					duration
-			},
+				} = event.detail
-			inputBindBlur() {
+				this.bottomVal = height
-				this.bottomVal = 0
+				setTimeout(() => {
-				// input 失去焦点，键盘隐藏，设置 input 所在盒子的 bottom 值为0
+					let query = uni.createSelectorQuery().in(this);
+					//需要给黄色区域设置一个id标识，在这里是demo
+					query.select('.input-box').boundingClientRect(data => {
+						this.inputboxtop = data.height //赋值，待会要用
+						setTimeout(e => {
+							this.scrollTop = this.scrollTop + 1;
+						}, 300)
+					}).exec();
+				}, 200)
 			},
 			getPageHistory() {
 				let obj = {
@@ -208,7 +216,9 @@
 						//需要给黄色区域设置一个id标识，在这里是demo
 						query.select('.input-box').boundingClientRect(data => {
 							this.inputboxtop = data.height //赋值，待会要用
-							this.scrollTop = this.scrollTop + 1;
+							setTimeout(e => {
+								this.scrollTop = this.scrollTop + 1;
+							}, 300)
 						}).exec();
 					}, 100)
 				})
@@ -235,7 +245,9 @@
 					//需要给黄色区域设置一个id标识，在这里是demo
 					query.select('.input-box').boundingClientRect(data => {
 						this.inputboxtop = data.height //赋值，待会要用
-						this.scrollTop = this.scrollTop + 1;
+						setTimeout(e => {
+							this.scrollTop = this.scrollTop + 1;
+						}, 300)
 					}).exec();
 				}, 200)
 			},
@@ -272,16 +284,14 @@
 					recipientName: that.currentItem.doctorName,
 					messageType: 1,
 					sendTime: new Date(),
-					content: this.formData.content
+					content: that.formData.content
 				}
 				sendMessage(obj).then(res => {
 					that.formData.content = '' //清空输入框的文本
 					setTimeout(() => {
 						that.scrollTop = that.scrollTop + 1;
 					}, 100)
-					if (res.code != 200) {
+					if (res.code != 200) {}
-
-					}
 				})
 				// try {
 				// 	const that = this
@@ -452,7 +462,9 @@
 					//需要给黄色区域设置一个id标识，在这里是demo
 					query.select('.input-box').boundingClientRect(data => {
 						this.inputboxtop = data.height //赋值，待会要用
-						this.scrollTop = this.scrollTop + 1;
+						setTimeout(e => {
+							this.scrollTop = this.scrollTop + 1;
+						}, 300)
 					}).exec();
 				}, 200)
 			},
@@ -502,7 +514,9 @@
 							//需要给黄色区域设置一个id标识，在这里是demo
 							query.select('.input-box').boundingClientRect(data => {
 								this.inputboxtop = data.height //赋值，待会要用
-								this.scrollTop = this.scrollTop + 1;
+								setTimeout(e => {
+									this.scrollTop = this.scrollTop + 1;
+								}, 300)
 							}).exec();
 						}, 100)
 						that.Read()
@@ -818,4 +832,4 @@
 			bottom: 38rpx;
 		}
 	}
-</style>
+</style>