react-dnd-nested:react-dnd 嵌套使用详解

时间:2024-06-18 03:25:27
【文件属性】:

文件名称:react-dnd-nested:react-dnd 嵌套使用详解

文件大小:2.92MB

文件格式:ZIP

更新时间:2024-06-18 03:25:27

react drag-and-drop react-dnd JavaScript

read-dnd 嵌套使用 不做具体react-dnd的api讲解,如有需要请查看官网文档,描述很清晰。 需求背景 左侧是物料区,各个可以拖拽的小组件 右侧为编辑区,可以将组件拖进去组成页面 右侧编辑区内已拖拽的小组件可以在内部继续拖拽进行排序 技术栈 react、react-dom、mobx、mobx-react、react-dnd 实现逻辑 数据结构设计 属性 类型 说明 id Number 组件id(根据规则自动生成) type String 组件类型 childrens Array 组件下面包含的子组件 // 数据示例如下: [ { id: 1, type: 'View', childrens: [ { id: 345, type: 'Bu


【文件预览】:
react-dnd-nested-master
----config()
--------modules.js(4KB)
--------getHttpsConfig.js(2KB)
--------webpackDevServer.config.js(7KB)
--------webpack.config.js(29KB)
--------jest()
--------pnpTs.js(620B)
--------env.js(4KB)
--------paths.js(2KB)
----images()
--------app.png(165KB)
--------list.png(168KB)
--------right.png(168KB)
--------move.png(292KB)
--------findItem.png(154KB)
--------item.png(963KB)
--------add.png(151KB)
--------left.png(336KB)
----docs()
--------service-worker.js(1KB)
--------asset-manifest.json(1KB)
--------precache-manifest.a7f4803806891745bfd96bfb22a4ae44.js(759B)
--------index.html(2KB)
--------static()
--------favicon.ico(4KB)
----package.json(4KB)
----src()
--------index.js(240B)
--------assets()
--------left()
--------right()
--------App.js(3KB)
--------style.css(575B)
----.gitignore(321B)
----public()
--------index.html(240B)
--------favicon.ico(4KB)
----README.md(3KB)
----scripts()
--------test.js(1KB)
--------build.js(7KB)
--------start.js(5KB)

网友评论