源碼 j哼丈、源碼 j-step-c11蔓倍、相關(guān)視頻
首先我們?cè)?code>components文件夾下創(chuàng)建SendMessage.vue
- renderer/index.js
// 請(qǐng)?zhí)砑痈吡敛糠执a
...
// import {
Button,
Input,
// TabPane,
// Tabs } from 'element-ui'
...
Vue.component(Button.name, Button)
Vue.component(Input.name, Input)
// Vue.component(TabPane.name, TabPane)
...
- components/SendMessage.vue
<template>
<div id="send-message">
<el-input
type="textarea"
:rows="10"
placeholder="輸入文本消息"></el-input>
<div id="buttons">
<el-button
id="send-text-btn"
type="primary">發(fā)送文本消息</el-button>
</div>
</div>
</template>
<style scoped>
#buttons {
margin-top: 8px;
}
</style>
- views/Chat.vue
<!-- 請(qǐng)?zhí)砑痈吡敛糠执a -->
<!-- <template>
<div id="chat">
<el-tabs v-model="activeName">
<el-tab-pane label="發(fā)消息" name="F"> -->
<send-message></send-message>
<!-- </el-tab-pane>
<el-tab-pane label="聯(lián)系人" name="M">
<chat-list></chat-list>
</el-tab-pane>
</el-tabs>
</div>
</template> -->
<script>
import SendMessage from '@/components/SendMessage.vue'
// import ChatList from '@/components/ChatList.vue'
// export default {
// components: {
'send-message': SendMessage,
// 'chat-list': ChatList
// },
...
// }
</script>
上一節(jié) Electron開發(fā)實(shí)戰(zhàn)之10-ChatList.vue
目錄
下一節(jié) Electron開發(fā)實(shí)戰(zhàn)之12-應(yīng)用架構(gòu)
