组件迁移，发送完消息之后的展示，延迟

pages/im/private/chat.nvue

@@ -1,7 +1,7 @@
 <template>
     <view class="chat">
         <!-- chat -->
-        <list class="chat-scroll">
+        <list class="chat-scroll" :show-scrollbar="false">
             <cell class="cell" v-for="(item, index) in messages" :key="index">
                 <view class="cell-time">
                     <text class="cell-time-text">{{ customCN(item.sentTime) }}</text>
@@ -10,12 +10,12 @@
                     <image class="active" :src="userInfo.portraitUrl" mode="aspectFill"
                         @click="showFriend(targetId, item.messageDirection)"></image>
                     <view class="msg">
-                        <imAUDIO v-if="item.objectName === 'RC:HQVCMsg'" :guest="item.messageDirection == 1"
+                        <show-voice v-if="item.objectName === 'RC:HQVCMsg'" :guest="item.messageDirection == 1"
-                            :msg="item.content"></imAUDIO>
+                            :msg="item.content"></show-voice>
-                        <imIMG v-if="item.objectName === 'RC:ImgMsg'" :guest="item.messageDirection == 1"
+                        <show-image v-if="item.objectName === 'RC:ImgMsg'" :guest="item.messageDirection == 1"
-                            :msg="item.content.content"></imIMG>
+                            :msg="item.content.content"></show-image>
-                        <imTXT v-if="item.objectName === 'RC:TxtMsg'" :guest="item.messageDirection == 1"
+                        <show-text v-if="item.objectName === 'RC:TxtMsg'" :guest="item.messageDirection == 1"
-                            :msg="item.content.content"></imTXT>
+                            :msg="item.content.content"></show-text>
                         <view class="state" v-if="item.messageDirection == 1">
                             <text class="state-text">{{ item.sentStatus == 50 ? '已读': '未读'}}</text>
                         </view>
@@ -58,19 +58,18 @@
     import * as RongIMLib from "@/uni_modules/RongCloud-IMWrapper/js_sdk/index"
     import im from '@/utils/im/index.js'
     import permision from "@/js_sdk/wa-permission/permission.js"
-    import imAUDIO from '@/components/im/imAUDIO'
+    import showVoice from './components/showVoice'
-    import imIMG from '@/components/im/imIMG'
+    import showImage from './components/showImage'
-    import imTXT from '@/components/im/imTXT'
+    import showText from './components/showText'
 
     var transcribe
-    var recorderManager = uni.getRecorderManager()
+    const recorderManager = uni.getRecorderManager()
-
     const ChatList = uni.requireNativePlugin('dom')
+
     export default {
         data() {
             return {
                 targetId: '',
-                scrollIntoID: 'chatID_0',
                 inputTxt: '',
                 messages: [],
                 conversationType: 1,
@@ -86,9 +85,9 @@
             }
         },
         components: {
-            imAUDIO,
+            showVoice,
-            imIMG,
+            showImage,
-            imTXT
+            showText
         },
         onLoad(e) {
             this.targetId = e.targetId
@@ -134,20 +133,6 @@
                 return this.inputTxt.length == 0
             }
         },
-        onNavigationBarButtonTap(e) {
-            if (e.index == 0) {
-                uni.navigateTo({
-                    url: '/pages/im/private/setting?targetId=' + this.targetId +
-                        '&conversationType=' + this.conversationType,
-                    events: {
-                        messageClear: () => {
-                            this.getMessageList()
-                            console.log('聊天消息被清空');
-                        }
-                    }
-                })
-            }
-        },
         methods: {
             customCN(val) {
                 return timeCustomCN(val)
@@ -198,44 +183,22 @@
                 recorderManager.onStop(res => {
                     im.sentVoice(this.conversationType, this.targetId, res.tempFilePath, (60 - this
                         .transcribeTime), () => {
+                        setTimeout(() => {
                             this.getMessageList()
+                        }, 500)
                     })
                     this.transcribeTime = 60
                     this.showAudioTranscribe = false
                 })
             },
-            getMessageList() {
             // 获取消息列表
-                const objectNames = [
+            getMessageList() {
-                    'RC:TxtMsg',
+                im.getMessageList(this.conversationType, this.targetId, (messages) => {
-                    'RC:VcMsg',
-                    'RC:HQVCMsg',
-                    'RC:ImgMsg',
-                    'RC:GIFMsg',
-                    'RC:ImgTextMsg',
-                    'RC:FileMsg',
-                    'RC:LBSMsg',
-                    'RC:SightMsg',
-                    'RC:ReferenceMsg',
-                    'RC:CombineMsg'
-                ]
-                const timeStamp = new Date().getTime()
-                const count = 10 // 获取的消息数量
-                const isForward = true // 是否向前获取
-                RongIMLib.getHistoryMessagesByTimestamp(this.conversationType, this.targetId, objectNames, timeStamp,
-                    count,
-                    isForward,
-                    ({
-                        code,
-                        messages
-                    }) => {
-                        if (code === 0) {
                     this.messages = messages.reverse()
                     this.scrollBottom()
-                        }
+                })
-                    }
-                )
             },
+            // 发送文本消息
             send() {
                 if (this.inputTxt === '') return
                 im.sentText(this.conversationType, this.targetId, this.inputTxt, () => {
@@ -245,19 +208,21 @@
                     this.inputTxt = ''
                 })
             },
+            // 展示好友信息
             showFriend(targetId, type) {
                 uni.navigateTo({
                     url: type === 1 ? '/pages/im/friends/mine?targetId=' + targetId :
                         '/pages/im/friends/info?targetId=' + targetId
                 })
             },
+            // 滚动到底部
             scrollBottom() {
                 setTimeout(() => {
                     let el = this.$refs.chatBottom
                     ChatList.scrollToElement(el, {
-                        animated: true
+                        animated: false
                     })
-                }, 100)
+                }, 50)
             }
         }
     }

pages/im/private/components/sentText.nvue

@@ -0,0 +1,15 @@
+<template>
+    <view>
+        
+    </view>
+</template>
+
+<script>
+    export default {
+        
+    }
+</script>
+
+<style>
+
+</style>

pages/im/private/components/sentVoice.nvue

@@ -0,0 +1,15 @@
+<template>
+    <view>
+        
+    </view>
+</template>
+
+<script>
+    export default {
+        
+    }
+</script>
+
+<style>
+
+</style>

pages/im/private/components/showImage.nvue

@@ -6,10 +6,10 @@
 
 <script>
     export default {
-        name:"im",
+        name: 'showImage',
-        props:{
+        props: {
-            msg : {
+            msg: {
-                type   : String,
+                type: String,
                 default: 'https://images.pexels.com/photos/9024609/pexels-photo-9024609.jpeg'
             },
             guest: {
@@ -17,11 +17,11 @@
                 default: true
             }
         },
-        methods:{
+        methods: {
-            openImg(){
+            openImg() {
                 uni.previewImage({
-                    urls    : [this.msg],
+                    urls: [this.msg],
-                    current : 1
+                    current: 1
                 })
             }
         }
@@ -29,19 +29,21 @@
 </script>
 
 <style scoped>
-    .im--img{
+    .im--img {
         padding: 19rpx;
     }
-    .im--img.left{
+
+    .im--img.left {
         border-radius: 0 20rpx 20rpx 20rpx;
         background: white;
     }
 
-    .im--img.right{
+    .im--img.right {
         border-radius: 20rpx 0 20rpx 20rpx;
         background: #34CE98;
     }
-    .src{
+
+    .src {
         width: 240rpx;
     }
 </style>

pages/im/private/components/showText.nvue

@@ -6,15 +6,15 @@
 
 <script>
     export default {
-        name:"im",
+        name: 'showText',
         data() {
             return {
 
             };
         },
-        props:{
+        props: {
-            msg : {
+            msg: {
-                type   : String,
+                type: String,
                 default: ''
             },
             guest: {
@@ -26,19 +26,19 @@
 </script>
 
 <style scoped>
-    .im--text{
+    .im--text {
         max-width: 400rpx;
         padding: 20rpx;
         font-size: 28rpx;
         line-height: 40rpx;
     }
 
-    .im--text.left{
+    .im--text.left {
         border-radius: 0 20rpx 20rpx 20rpx;
         background: white;
     }
 
-    .im--text.right{
+    .im--text.right {
         border-radius: 20rpx 0 20rpx 20rpx;
         background: #34CE98;
         color: white;

pages/im/private/components/showVoice.nvue

@@ -10,7 +10,7 @@
 
 <script>
     export default {
-        name: "im",
+        name: 'showVoice',
         props: {
             msg: {
                 type: Object,

utils/im/message.js

@@ -1,5 +1,43 @@
 import store from '@/store/index.js'
 import * as RongIMLib from '@/uni_modules/RongCloud-IMWrapper/js_sdk/index'
+
+const getMessageList = (conversationType, targetId, callback) => {
+    // 获取消息列表
+    const objectNames = [
+        'RC:TxtMsg',
+        'RC:VcMsg',
+        'RC:HQVCMsg',
+        'RC:ImgMsg',
+        'RC:GIFMsg',
+        'RC:ImgTextMsg',
+        'RC:FileMsg',
+        'RC:LBSMsg',
+        'RC:SightMsg',
+        'RC:ReferenceMsg',
+        'RC:CombineMsg'
+    ]
+    const timeStamp = new Date().getTime()
+    const count = 10 // 获取的消息数量
+    const isForward = true // 是否向前获取
+    RongIMLib.getHistoryMessagesByTimestamp(conversationType, targetId, objectNames, timeStamp,
+        count,
+        isForward,
+        ({
+            code,
+            messages
+        }) => {
+            if (code === 0) {
+                callback(messages)
+            } else {
+                uni.showToast({
+                    icon: 'error',
+                    title: code
+                })
+            }
+        }
+    )
+}
+
 /**
  * 发送文本消息
  * @param {number}  conversationType 消息类型
@@ -146,6 +184,7 @@ const sendFile = (conversationType, targetId, fileUrl, time, callback) => {
 }
 
 export default {
+    getMessageList,
     sentText,
     sentVoice,
     sentImage,