安裝
1. 確定電腦已裝node和npm
出現版本號則說明電腦已經安裝好node和npm
2. 創建一個基於webpack的項目
3. 在項目里安裝依賴
4. 運行
配置路由
為了動態渲染各個頁面的組件，這個是必須的，這些都在router文件夾里的index.js配置好，在components文件夾在下面新建index.vue
1. 導入頁面
2. 配置全局路徑
Element-UI
使用element-ui編寫頁面樣式，具體操作參照官網
1. 安裝
2. 全局配置
找到main.js文件,引入官網提供的樣式
頁面
參考element-ui官網做出一些假數據寫出index頁
綁定table數據
1. 安裝並全局導入axios（導入方式看官網）
axios 並不屬於 vue的插件
框架與Http本身沒有必然的歸屬性關系，是要實現了Http標准，都可以在任意框架中使用
想要使用this調用的話，可以綁定到vue.prototype上
2. 獲取接口，綁定數據
新增日志數據【知識點：父子組件的傳值】
1. 新建新增日志組件edit,並且在父組件里調用，edit頁面內容forms快捷鍵自動生成
非空驗證（詳情看elementUi form表單驗證） 
3.點添加，顯示彈窗。
4. 在子組件里method里寫新增方法submit()
新增事件：submit,取消事件：cancel-dialog一起傳到父組件，在父組件里寫方法操作
👆子👇
父👇
1. 新增里面驗證非空通過就提交model到父組件。
2. 父組件寫方法獲取api並傳入model,關閉dialog,清空表單（在子組件寫清空方法然后父組件調用，ref，refs）
3. 賦值到頁面中,再加載一遍頁面
子👆
父👇
刪除日志
寫刪除方法
1. 用element組件的刪除方法，傳入索引和數據，其
2. 寫刪除方法接收索引，獲取當前數據行的Id，傳入，然后調用api方法刪除數據，刪除單元格，本demo加了是否刪除數據彈窗
修改日志
1. 修改和添加可以用一個子組件，點擊修改，修改彈窗顯示，然后將本條數據傳入到子組件中，子組件接收一下就可以
此時應該注意這個row，是點擊編輯的時候傳入的，因為我們在編輯的時候寫了edit(tabledata[scope.$index])，然后這個editdata是我們將要傳入子組件的數據。這樣還遠遠不夠，我們需要再父組件中引用的子組件綁定:data接收傳值
這樣父組件所做的事就完成了，下面是我們的子組件
2. 子組件接收父組件傳值
props接收,mounted初始化數據<如果傳進來值就賦值給表單，如果沒有就初始化表單>，watch監聽數據變化<不監聽的話，文本框的值不會變>
最后點擊提交edita方法將數據傳到父組件，這和我們做添加時的邏輯是一樣的，不需要再做改變。
3. 父組件頁面接收@submit，並定義方法提交數據到修改的接口（需要看數據是什么格式的再決定傳入），關閉彈窗
關於綁定數據的問題
1. :data="model"
(1)用於綁定向子組件傳的數據，在父組件data里必須定義完整
(2)用於綁定table數據，寫在el-table最外層，在子組件里定義類型就可以，做列表顯示用，init里賦值
2. :model="model"
(1)el-from里綁定的數據，el-form-item里則為v-model="model.user"
關於element-ui表單驗證的坑
1.:rules="rules"，不是少個s,就是少個：
2.最外層:model,rel
3.item層:prop(有幾次都忘記寫)
4.input層:v-model
關於出現這種低級錯誤的原因如下圖
本文原demo地址 https://gitee.com/losingdreaming/log