資訊專欄INFORMATION COLUMN
摘要：和比起來差別還是挺大的至少能讓別人看得下去了預(yù)覽特性雙擊節(jié)點添加一個字節(jié)點對節(jié)點進行任意拖拽控制特定節(jié)點是否可拖是否可放置其他節(jié)點增加刪除任意層級的節(jié)點待添加接口屬性屬性名描述類型默認值節(jié)點樹的數(shù)據(jù)新生成的節(jié)點的文本屬性新增節(jié)點判斷哪些
Github: https://github.com/shuiRong/v...
Demo: https://vigilant-curran-d6fec...
和v1.0.0比起來,差別還是挺大的.(至少能讓別人看得下去了)
預(yù)覽:
特性:
雙擊節(jié)點添加一個字節(jié)點
對節(jié)點進行任意拖拽
控制特定節(jié)點是否可拖、是否可放置其他節(jié)點
增加/刪除 任意層級的節(jié)點（#待添加）
接口屬性
| 屬性名 | 描述 | 類型 | 默認值 |
|---|---|---|---|
| data | 節(jié)點樹的數(shù)據(jù) | Array | －－ |
| defaultText | 新生成的節(jié)點的文本(name屬性) | String | 新增節(jié)點 |
| allowDrag | 判斷哪些節(jié)點可以被拖拽（return true表示允許） | Function | ()=>true |
| allowDrop | 判斷哪些節(jié)點可以被塞入其他節(jié)點（return true表示允許） | Function | ()=>true |
方法
| 方法名 | 描述 | 參數(shù) |
|---|---|---|
| current-clicked | 告訴你哪個節(jié)點被點擊了，這個節(jié)點所在的組件是哪個 | (model,component) model: 當前被點擊節(jié)點的數(shù)據(jù)． component: 當前節(jié)點所在的樹組件 |
| drag | 節(jié)點被拖動時觸發(fā)的?drag?事件 | (model,component,e) model: 當前被拖動節(jié)點的數(shù)據(jù); component: 當前被拖動節(jié)點所在的樹組件（VNode）; e: 拖拽事件 |
| drag-enter | 當被拖動節(jié)點進入有效的放置目標時，?dragenter?事件被觸發(fā) | (model,component,e) model: 有效放置目標節(jié)點的數(shù)據(jù); component: 有效放置目標節(jié)點所在的樹組件（VNode）; e: 拖拽事件 |
| drag-leave | 當被拖動節(jié)點離開有效的放置目標時，?dragleave?事件被觸發(fā) | (model,component,e) model: 有效放置目標節(jié)點的數(shù)據(jù); component: 有效放置目標節(jié)點所在的樹組件（VNode）; e: 拖拽事件 |
| drag-over | 當節(jié)點被拖拽到一個有效的放置目標上時，觸發(fā)?dragover?事件 | (model,component,e) model: 有效放置目標節(jié)點的數(shù)據(jù); component: 有效放置目標節(jié)點所在的樹組件（VNode）; e: 拖拽事件 |
| drag-end | 拖放事件在拖放操作結(jié)束時觸發(fā) | (model,component,e) model: 當前被拖動節(jié)點的數(shù)據(jù); component: 當前被拖動節(jié)點所在的樹組件（VNode）; e: 拖拽事件 |
| drop | 當節(jié)點被放置到一個有效的防止目標上時，drop被觸發(fā) | (model,component,e) model: 當前被拖動節(jié)點的數(shù)據(jù); component: 當前被拖動節(jié)點所在的樹組件（VNode）; e: 拖拽事件 |
License
MIT
文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址：http://specialneedsforspecialkids.com/yun/112204.html
摘要：和比起來差別還是挺大的至少能讓別人看得下去了預(yù)覽特性雙擊節(jié)點添加一個字節(jié)點對節(jié)點進行任意拖拽控制特定節(jié)點是否可拖是否可放置其他節(jié)點增加刪除任意層級的節(jié)點待添加接口屬性屬性名描述類型默認值節(jié)點樹的數(shù)據(jù)新生成的節(jié)點的文本屬性新增節(jié)點判斷哪些 Github: https://github.com/shuiRong/v...Demo: https://vigilant-curran-d6fec...
摘要：前端日報精選譯，和的未來學(xué)習筆記箭頭函數(shù)學(xué)習筆記教程柵格布局卷土重來，用還是為什么我會選擇而不是眾成翻譯原生開發(fā)入門完全教程從零到壹全棧部落中文一個端帶文件路徑和顏色的攻城方略譯使用提高應(yīng)用程序的種方式中自定義操作符修仙 2017-07-02 前端日報 精選 [譯] TC39，ECMAScript 和 JavaScript 的未來（Part 1）ES6學(xué)習筆記：箭頭函數(shù)_ES6, Ja...
效果展示： 點擊即可隨意調(diào)節(jié)菜單寬度 變動后 頁面結(jié)構(gòu)一共分為三部分，加上一個伸縮按鈕，在你的項目對應(yīng)的部分都加上class名?！ ∥疫@里定義的分別是box、left、mid、resize(按鈕類名) html 頁面結(jié)構(gòu)劃分完成之后，完善一下樣式（直接復(fù)制，菜單類名換成你的） /*拖拽區(qū)div樣式*/ .resize{ cursor:col-resize; positi...
閱讀 3209·2023-04-26 02:27
閱讀 2138·2021-11-22 14:44
閱讀 4082·2021-10-22 09:54
閱讀 3195·2021-10-14 09:43
閱讀 748·2021-09-23 11:53
閱讀 12675·2021-09-22 15:33
閱讀 2704·2019-08-30 15:54
閱讀 2681·2019-08-30 14:04
