修正初始滚动

src/chat.js

@@ -142,7 +142,7 @@ export default class Chat {
         data.map(item => ({ timestamp: new Date(item.time).getTime(), ...item }))
             .filter(item => !item.ban)
             .sort((a, b) => a.timestamp - b.timestamp).forEach(item => {
-                this.添加元素(item)
+                this.添加元素(item, true)
             })
     }
     async 筛选指定范围的消息({ start, end }) {
@@ -196,7 +196,7 @@ export default class Chat {
             this.event.onsend(text)
         }
     }
-    添加元素(data) {
+    添加元素(data, local) {
         // 人类可读的时间: 今天,昨天, 空字符串
         function convertTimestampToReadableTime(timestamp) {
             const date = new Date(timestamp);
@@ -231,37 +231,39 @@ export default class Chat {
                 ]
             }))
         }
-
+        //// 将时间转换为人类可读的格式: 如果是今天,则显示时间,如果是昨天,则显示昨天,如果是今年,则显示月日,如果是去年,则显示年月日
+        //const redate = (str) => {
+        //    const date = new Date(str)
+        //    const now = new Date()
+        //    const year = date.getFullYear()
+        //    const month = date.getMonth() + 1
+        //    const day = date.getDate()
+        //    const hour = date.getHours()
+        //    const minute = date.getMinutes()
+        //    const nowYear = now.getFullYear()
+        //    const nowMonth = now.getMonth() + 1
+        //    const nowDay = now.getDate()
+        //    if (year === nowYear && month === nowMonth && day === nowDay) {
+        //        return `${hour}:${minute}`
+        //    }
+        //    if (year === nowYear && month === nowMonth && day === nowDay - 1) {
+        //        return `昨天 ${hour}:${minute}`
+        //    }
+        //    if (year === nowYear) {
+        //        return `${month}月${day}日 ${hour}:${minute}`
+        //    }
+        //    return `${year}年${month}月${day}日 ${hour}:${minute}`
+        //}
+        const scroll = this.ul.scrollHeight === this.ul.clientHeight + this.ul.scrollTop
         // 如果和上一条消息是同一人, 且时间间隔小于1小时, 则向上合并
         if (this.last && this.last.name === data.name && new Date(data.time).getTime() - new Date(this.last.time).getTime() < 1000 * 60 * 60) {
             this.last.item.querySelector('ul').appendChild(ListItem({ textContent: data.text }))
             this.last = { ...data, item: this.last.item }
-            return this.last.item
+            if (scroll || local) {
+                this.ul.scrollTop = this.ul.scrollHeight
+            }
+            return
         }
-        // 将时间转换为人类可读的格式: 如果是今天,则显示时间,如果是昨天,则显示昨天,如果是今年,则显示月日,如果是去年,则显示年月日
-        const redate = (str) => {
-            const date = new Date(str)
-            const now = new Date()
-            const year = date.getFullYear()
-            const month = date.getMonth() + 1
-            const day = date.getDate()
-            const hour = date.getHours()
-            const minute = date.getMinutes()
-            const nowYear = now.getFullYear()
-            const nowMonth = now.getMonth() + 1
-            const nowDay = now.getDate()
-            if (year === nowYear && month === nowMonth && day === nowDay) {
-                return `${hour}:${minute}`
-            }
-            if (year === nowYear && month === nowMonth && day === nowDay - 1) {
-                return `昨天 ${hour}:${minute}`
-            }
-            if (year === nowYear) {
-                return `${month}月${day}日 ${hour}:${minute}`
-            }
-            return `${year}年${month}月${day}日 ${hour}:${minute}`
-        }
-        const scroll = this.ul.scrollHeight === this.ul.clientHeight + this.ul.scrollTop
         this.ul.appendChild(ListItem({
             style: {
                 margin: '1rem',
@@ -287,8 +289,6 @@ export default class Chat {
                                 color: '#888',
                                 fontSize: '12px',
                             },
-                            //textContent: `${redate(data.time)}`
-                            // 只取时间, 不要秒
                             textContent: `${data.time.split(' ')[1].split(':')[0]}:${data.time.split(' ')[1].split(':')[1]}`
                         }),
                         Button({