gpt4 book ai didi

reactjs - React onDrop 没有触发

转载 作者:搜寻专家 更新时间:2023-10-30 20:33:21 28 4
gpt4 key购买 nike

下面是我尝试使用的示例代码,它是 react + TypeScript。onDragEnter 和 onDragOver 工作正常,但 onDrop 事件不正常。

import * as React from 'react';

export class FileZone extends React.Component {

onDragOver = (e) => {
let event = e as Event;
event.stopPropagation();
}

onDragEnter = (e) => {
let event = e as Event;
event.stopPropagation();
}

onFileDrop = (e) => {
let event = e as Event;
event.stopPropagation();

console.log("onFileDrop");
alert("dropped")
}

render() {
return (
<div
onDragEnter={this.onDragEnter}
onDragOver={this.onDragOver}
onDrop={this.onFileDrop}>
Drag and drop file here
</div>)
}
}

最佳答案

最后我遇到了问题,出于某种原因我必须像这样处理 onDragOver :

onDragOver = (e) => {
let event = e as Event;
event.stopPropagation();
event.preventDefault();
}

这解决了我的问题。

关于reactjs - React onDrop 没有触发,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50230048/

28 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com