datatransfer传数据必须严格遵循事件生命周期：dragstart设setdata、dragover阻止默认行为、drop中用相同mime类型getdata，三者缺一不可；跨源、移动端不支持，文件只能通过files属性获取。
dataTransfer 能传数据，但必须严格按事件生命周期写，漏一步就拿不到——dragstart不设、dragover不阻止默认行为、drop里乱读格式，三者任一出错，getData() 都返回空字符串。
dragstart 必须调用 setData()，且只能在这里写
这是唯一能往 dataTransfer 写入数据的时机。其他事件（如 drag、dragover）里调用 setData() 会被浏览器忽略，不报错也不生效。
-
setData()第一个参数是 MIME 类型，不是随便起的名：必须用"text/plain"、"text/html"或"text/uri-list"；写成"string"、"mydata"、"json"都会静默失败 - 想传对象？先
JSON.stringify()转成字符串，再塞进"text/plain"；接收端再JSON.parse() - 别在
dragstart里尝试塞File对象——浏览器禁止 JS 向dataTransfer注入真实文件，files属性是只读的、独立通道
dragover 不 preventDefault()，drop 根本不会触发
没这句，整个拖放链就断了：drop 事件压根不会执行，更别说读数据。这不是可选项，是硬性前提。
- 必须在
dragover的事件处理函数里写event.preventDefault()，哪怕只是空函数也要加 - 只监听
drop不监听dragover？不行。目标元素没dragover处理，浏览器认为“不可放置”，直接跳过drop - 如果目标是
<input type="file">或原生文件区域，它自己有默认行为，但自定义 div 必须手动接管
drop 里 getData() 取不到？先核对 format 字符串是否完全一致
getData("text/plain") 和 getData("TEXT/PLAIN") 不等价，大小写敏感；setData("text/plain", "a") 后用 getData("text/html") 一定为空。
- 传的时候用什么
format，取的时候必须一模一样——包括大小写、斜杠方向、有无空格 - 调试时可遍历支持的类型：
Array.from(event.dataTransfer.types)，确认浏览器实际存了哪些键 - 跨 iframe 拖拽？不同源时
getData()总是空字符串，这是同源策略强制限制，无法绕过 - 移动端基本不支持这套 API，iOS Safari 和 Android Chrome 默认禁用
dragstart/drop，别指望它能跑通
文件拖放别碰 setData()，直接读 files 属性
用户拖进来的文件，和 setData() 完全无关。event.dataTransfer.files 是原生 FileList，安全沙箱下 JS 无法伪造或注入。
- 预览图片？用
URL.createObjectURL(file)，不是getData("file")——后者永远返回空字符串 - 想传文件名或路径？可以
setData("text/plain", file.name)辅助标识，但文件本体必须走files -
effectAllowed和dropEffect不是摆设：设成"move"却不在drop里删源节点，用户会困惑；光标样式不匹配也会导致操作失败，尤其在 macOS 上更敏感
最易被忽略的是：dataTransfer 不是全局变量，它只在 dragstart 和 drop 的 event 对象里临时存在，中间所有事件都不可写不可读——这不是设计缺陷，是浏览器刻意做的隔离。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
