資訊專欄INFORMATION COLUMN
一個vue-table的組件 說明：
1.支持樹形數(shù)據(jù)的展示
2.行拖拽排序
3.單元格拖拽排序
github
使用方法：npm install ele-table
例如：在需要使用的vue頁面中：
-+
{{scope.row.id}}
Calendar Attributes
| 參數(shù) | 說明 | 類型 | 可選值 | 默認(rèn)值 |
|---|---|---|---|---|
| data | 顯示的數(shù)據(jù) | array | — | — |
| treetable | 是否樹形數(shù)據(jù) | boolean | — | false |
| _expand | 樹形數(shù)據(jù)默認(rèn)展開節(jié)點（不支持遞歸關(guān)聯(lián)） | boolean | — | false |
| draggablerow | 是否開啟行拖拽 | boolean | — | false |
| draggable | 是否開啟單元格拖拽 | boolean | — | false |
| allow-drag | 能否被拖拽 | Function(row(行數(shù)據(jù)), column(行拖拽為index,單元格為所在列), cell(節(jié)點), event) | — | 要求返回boolean |
| allow-drop | 能否被放置 | Function(row, column, cell, event, type) | — | 要求返回boolean |
| 事件名 | 說明 | 參數(shù) |
|---|---|---|
| node-drag-start | 節(jié)點開始拖拽時觸發(fā)的事件 | Function(row(行數(shù)據(jù)), column(行拖拽為index,單元格為所在列), cell(節(jié)點), event) |
| node-drag-enter | 拖拽進(jìn)入其他節(jié)點時觸發(fā)的事件 | Function(row(行數(shù)據(jù)), column(行拖拽為index,單元格為所在列), cell(節(jié)點), event, draggingNode(被拖拽節(jié)點) |
| node-drag-leave | 拖拽離開某個節(jié)點時觸發(fā)的事件 | Function(row(行數(shù)據(jù)), column(行拖拽為index,單元格為所在列), cell(節(jié)點), event, draggingNode(被拖拽節(jié)點) |
| node-drag-over | 在拖拽節(jié)點時觸發(fā)的事件 | Function(row(行數(shù)據(jù)), column(行拖拽為index,單元格為所在列), cell(節(jié)點), event, draggingNode(被拖拽節(jié)點) |
| node-drag-end | 拖拽結(jié)束時觸發(fā)的事件 | Function(dragging(被拖拽節(jié)點對象), drop(放置節(jié)點對象), dropType(放置位置（before、after、inner）), event) |
| node-drop | 拖拽完成時觸發(fā)的事件 | Function(dragging(被拖拽節(jié)點對象), drop(放置節(jié)點對象), dropType(放置位置（before、after、inner）), event) |
文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址：http://systransis.cn/yun/96970.html
摘要：在前端頁面中，把用純對象表示，負(fù)責(zé)顯示，兩者做到了最大限度的分離。的顯示與否和的布爾值有關(guān)，還是只關(guān)注數(shù)據(jù)的變化。兩個組件的布爾值通過兩個臨近的按鈕控制，初始值和的結(jié)果都是。組件的聲明在組件上，則完全沒有進(jìn)入生命周期。 開始前說一說 吐槽 首先， 文章有謬誤的地方， 請評論， 我會進(jìn)行驗證修改。謝謝。 vue真是個好東西，但vue的中文文檔還有很大的改進(jìn)空間，有點大雜燴的意思，對于怎么...
摘要：接下來來看一下是如何編寫一個組件的，在看源碼之前，首先還是要對他的組件的大致功能有一個了解，這樣我們在看源碼的時候才會知道這一段大概實現(xiàn)了什么功能。最后我實現(xiàn)的功能文檔以及最終的一個樣例 在你實現(xiàn)一個組件過程中，一定要注意一下幾點 將代碼模塊化并且分離。如果你將大量的邏輯或者是代碼都放在鉤子函數(shù)中（比如mounted），那么寫出來的組件代碼將非常丑陋，這樣子寫出的代碼也往往難以維護(hù)。...
摘要：父組件定義表頭和表內(nèi)容表格數(shù)據(jù)表頭數(shù)據(jù)引入并注冊子組件注冊子組件獲取表頭和表內(nèi)容數(shù)據(jù)。 父組件 定義表頭和表內(nèi)容 data(){ return{ // 表格數(shù)據(jù) tableColumns: [], // 表頭數(shù)據(jù) titleData:[], } } 引入并注冊子組件 import TableComponents from ../../compon...
摘要：項目中，組件是項目的基石，每個頁面都是組件來組裝起來，我司沒有自己的組件庫，選用的是組件庫，在它的基礎(chǔ)上再次封裝。部分代碼三級效果如下總結(jié)組件是項目的積木條，公用組件的封裝成功與否其實是對項目的開發(fā)效率有直接影響。 vue項目中，組件是項目的基石，每個頁面都是組件來組裝起來，我司沒有自己的組件庫，選用的是ElementUI組件庫，在它的基礎(chǔ)上再次封裝。 可編輯表格 由于是后臺管理項目，...
閱讀 1453·2021-09-28 09:44
閱讀 2520·2021-09-28 09:36
閱讀 1190·2021-09-08 09:35
閱讀 1993·2019-08-29 13:50
閱讀 821·2019-08-29 13:29
閱讀 1142·2019-08-29 13:15
閱讀 1735·2019-08-29 13:00
閱讀 3003·2019-08-26 16:16
