fix(SPA): 聊天无法发送和显示的问题

slimkit · Dec 6, 2018 · 60d2443 · 60d2443
1 parent f9bce5e
commit 60d2443
Show file tree

Hide file tree

Showing 5 changed files with 19 additions and 26 deletions.
diff --git a/resources/spa/src/page/message2/chat/chat-list.vue b/resources/spa/src/page/message2/chat/chat-list.vue
@@ -16,13 +16,13 @@
   </div>
 </template>
 <script>
-import chatItem from './chat-item.vue'
+import ChatItem from './chat-item.vue'
 import { mapState, mapActions } from 'vuex'
 import { startSingleChat } from '@/vendor/easemob/'
 export default {
   name: 'ChatList',
   components: {
-    chatItem,
+    ChatItem,
   },
   data () {
     return {}

diff --git a/resources/spa/src/page/message2/chat/chat-room.vue b/resources/spa/src/page/message2/chat/chat-room.vue
@@ -1,26 +1,20 @@
 <template>
   <div class="p-chat-room m-box-model">
-    <CommonHeader><span class="m-text-cut">{{ name }}</span><span>{{ count }}</span></CommonHeader>
+    <CommonHeader>
+      <span class="m-text-cut">{{ name }}</span>
+      <span>{{ count }}</span>
+    </CommonHeader>
 
-    <main
-      ref="main"
-      class="m-box-model p-chat-room-main m-flex-grow1 m-flex-shrink1 m-main"
-    >
-      <Bubble
+    <main ref="main" class="m-box-model p-chat-room-main m-flex-grow1 m-flex-shrink1 m-main">
+      <MessageBubble
         v-for="msg in messages"
         :key="msg.id"
         :msg="msg"
       />
     </main>
 
-    <footer
-      ref="footer"
-      class="m-box m-aln-end m-main p-chat-room-foot m-flex-grow0 m-flex-shrink0 m-bt1"
-    >
-      <form
-        action="#"
-        class="m-box-model m-aln-center m-justify-center m-flex-grow1 m-flex-shrink1 m-main p-chat-input"
-      >
+    <footer ref="footer" class="m-box m-aln-end m-main p-chat-room-foot m-flex-grow0 m-flex-shrink0 m-bt1">
+      <form action="#" class="m-box-model m-aln-center m-justify-center m-flex-grow1 m-flex-shrink1 m-main p-chat-input">
         <textarea
           ref="textarea"
           v-model.trim="body"
@@ -52,11 +46,11 @@
 import $Message from '@/plugins/message-box'
 import WebIM, { sendTextMessage } from '@/vendor/easemob'
 
-import bubble from './message-bubble.vue'
+import MessageBubble from './message-bubble.vue'
 export default {
   name: 'ChatRoom',
   components: {
-    bubble,
+    MessageBubble,
   },
   data () {
     return {

diff --git a/resources/spa/src/page/message2/chat/message-bubble.vue b/resources/spa/src/page/message2/chat/message-bubble.vue
@@ -21,8 +21,9 @@
 </template>
 <script>
 import { mapState } from 'vuex'
+
 export default {
-  name: 'Bubble',
+  name: 'MessageBubble',
   props: {
     msg: { type: [Object, String], default: '' },
   },

diff --git a/resources/spa/src/page/message2/index.vue b/resources/spa/src/page/message2/index.vue
@@ -35,6 +35,7 @@
 
 <script>
 import { mapState, mapGetters } from 'vuex'
+
 export default {
   name: 'MessageIndex',
   data () {

diff --git a/resources/spa/src/routers/message.js b/resources/spa/src/routers/message.js
@@ -17,9 +17,9 @@ const AuditList = () =>
 const feedCommentAudit = () =>
   import(/* webpackChunkName: 'message' */ '@/page/message/children/audits/feedCommentAudit')
 
-const chatList = () =>
+const ChatList = () =>
   import(/* webpackChunkName: 'message' */ '@/page/message2/chat/chat-list.vue')
-const chatRoom = () =>
+const ChatRoom = () =>
   import(/* webpackChunkName: 'message' */ '@/page/message2/chat/chat-room.vue')
 
 // 通知
@@ -34,7 +34,6 @@ export default [
     component: MessageIndex,
     redirect: '/message/info',
     meta: {
-      title: '消息',
       requiresAuth: true,
     },
     children: [
@@ -43,22 +42,20 @@ export default [
         component: info,
         meta: {
           title: '消息',
-          requiresAuth: true,
         },
       },
       {
         path: 'chats',
-        component: chatList,
+        component: ChatList,
         meta: {
           title: '聊天',
-          requiresAuth: true,
         },
       },
     ],
   },
   {
     path: '/chats/:chatID(\\d+)',
-    component: chatRoom,
+    component: ChatRoom,
     meta: {
       title: '对话',
       requiresAuth: true,