@拖拽 / 博客 RSS 訂閱

Oct 26 2024

qngyun1029 - vuedraggable實現分組拖拽，組與組之間拖拽排序，組內部元素跨組拖拽

代碼如下： 參考 https://sortablejs.github.io/Vue.Draggable/#/functional template draggable v-model="rows" tag="div" class="wrapper" handle=".group-mover" div class="columns-wrapper" v-for="(col, idxCo

vue.js , 拖拽

收藏 評論

Jan 16 2025

xachary - 基於 CSS Grid 的簡易拖拉拽 Vue3 組件，從代碼到NPM發佈（3）- 小結

基本完成了拖動、調整大小、拖入、拖出、嵌套、刪除等特性，可以基於組件嵌套，也可以基於數據結構嵌套。算是告一段落了，後面在使用過程發現問題解決問題好了。 請大家動動小手，給我一個免費的 Star 吧~ 大家如果發現了 Bug，歡迎來提 Issue 喲~ github源碼 NPM 示例地址 文檔 交互細節 拖動 基本拖動 拖動區域擴展 拖動目標判斷 調整大小 基本調整大小 調整

組件庫 , vue3 , 拖拽 , typescript , 前端

收藏 評論

Nov 18 2025

子丶不語 - Vue3 手勢指令發佈！

在Vue3開發中，框架本身並沒有內置豐富的手勢指令（如滑動、捏合、長按等），開發者只能使用基礎的鼠標/觸摸事件綁定（如@click、@mousedown、@touchstart等）。這在需要複雜手勢交互的移動端應用開發中，往往顯得力不從心。 好消息是，vue3-touch-events來了！這是一個專為Vue3設計的強大手勢事件庫，讓你輕鬆實現各種觸摸手勢交互，完美支持移動

縮放 , Vue , 拖拽 , Css , 前端開發 , HTML

收藏 評論

Oct 28 2021

10101 - 任性佈局:一款vue可視化拖拽自由佈局轉flex佈局在線工具,一鍵生成vue代碼

分享一款可視化拖拽自由佈局轉flex佈局在線工具(內置趣味聊天室) 這款工具和大部分可視化拖拽工具不同的是(他採用自由佈局,而非流式佈局),最後根據座標運算,推導出flex佈局代碼(通過增加冗餘樣式,來儘可能適配uniapp h5端和小程序端) 線上demo(電腦端打開): http://aicode.shagua.wiki/uni/index.html#/ 特性 1.可視化,自由拖拽,推導

拖拽 , 可視化 , 前端 , Javascript

收藏 評論

Dec 21 2021

SnowWolfArden - Day 18/100 react-draggable 實現組件拖拽功能

1、需求 想實現頁面彈窗的拖拽功能，原生手寫時，基本邏輯能實現，但是拖拽雙擊操作時，會有bug，待解決，就想着看看有沒有合適的組件，發現還真有~ 2、介紹 周下載量300w+ 2.1支持有各種拖拽情況的Demo實現 2.1支持有各種拖拽情況的Demo實現；大概十幾種； 2.2支持React16.3+ 2.3 基本代碼 Draggable divI can now be moved aro

react , 拖拽 , Javascript

收藏 評論

Feb 01 2022

水冗水孚 - 拖拽插件sortable.js之el-table表格拖拽效果代碼

問題描述 Sortable.js是一款優秀的js拖拽庫，因為是原生js寫的，所以性能不錯，也支持移動端哦。本文舉兩個案例來學習一下。 案例一 簡單拖拽 效果圖 代碼附上 關於理解看註釋哦，運行的話複製粘貼即可 !DOCTYPE html html head meta charset="utf-8" / titlesortable.js拖動例子/title meta na

拖拽 , element-ui

收藏 評論

Dec 17 2025

level - 給視頻加上自己的水印，再也不用擔心被盜圖了

小夥伴們，在職場中有沒有遇到下面這種讓人生氣的情況：辛辛苦苦剪了一週的視頻，發到羣裏或發給客户預覽，結果轉頭就被別人拿去用了，還沒署名，簡直讓人無語！我之前剛上班的時候，這種情況真的遇見過不少！其實，防止盜用、提升專業度簡單的辦法，就是在視頻里加上自己的專屬水印。 但問題是，已經拍好或導出的成品視頻，還能添加水印嗎？難道還要重新渲染一遍？不用這麼麻煩！ 今天，

上傳 , 後端開發 , 拖拽 , 視頻轉換 , Python

收藏 評論

Dec 05 2025

liumang - uniapp微信小程序應用騰訊地圖及實現自定義拖拽view

實現效果 地圖定位、地點搜索、拖拽地圖中心定位 底部view拖拽下滑和上滑 拖拽和縮放地圖，底部view滑動到底部 實現方案 方案一 通過uniapp提供的movable-area movable-view 實現滑動。一開始還算順利，但是後邊遇到了各種奇葩問題，主要就是屏幕事件衝突的問題和輸入框焦點問題。導致我不得不想各種野路子去解決，最後算是順利實現了，但是偶爾

微信小程序 , uni-app , 拖拽 , 騰訊地圖 , 前端

收藏 評論

Dec 15 2025

w_omit - 國產 Canvas 引擎！神器！

寫過原生 Canvas 的朋友都懂： API 低級到懷疑人生——畫個帶圓角的矩形就要 20 行起步，縮放、拖拽、層級管理全靠自己實現。 節點一多直接 PPT——超過 5000 個元素，頁面卡成幻燈片。 於是，我們一邊掉頭髮，一邊默唸：“有沒有一款庫，寫得少、跑得快、文檔還是中文？” 什麼是 LeaferJS LeaferJS 是一

vue.js , 小遊戲 , github , 拖拽 , 前端開發

收藏 評論

Jul 29 2025

GeekCat - CMP 如何優雅的實現跨軟件的拖拽功能

在現代桌面應用中，拖拽（Drag-and-Drop）操作是一種極其直觀且提升用户體驗的交互方式。它允許用户通過直接操作界面元素來移動數據、重新組織內容，從而極大地簡化了複雜任務。如果你正在使用 Kotlin Compose Multiplatform 開發桌面應用，並希望為你的應用增添這一強大的交互功能，那麼你來對地方了！ 本文將深入探討如何在 Compose Multiplatform Desk

跨平台 , desktop-application , 拖拽

收藏 評論