我们先实现一个简单的流程：
可以看到，对于Chat.vue页面，我们需要一个Tabs组件。
我们选用element-ui快速搭建页面。
- bash
yarn add element-ui -D- renderer/index.js
// 添加代码
...
import { TabPane, Tabs } from 'element-ui'
...
Vue.component(TabPane.name, TabPane)
Vue.component(Tabs.name, Tabs)
...
- views/Chat.vue
发消息
联系人
#chat {
height: 100%;
margin: 0 8px;
}
我们还需要两个自定义组件：
- ChatList.vue: 联系人列表
- SendMessage.vue: 用来发送消息
