主题很好,但是单击该组件时未触发我的事件句柄,看不到出了什么问题。有任何想法吗?这与通过数组元素进行映射有关吗?
function App() {
const [fileTree, setFileTree] = useState(null);
useEffect(() => {
const data = getFileTree();
setFileTree(data)
}, []);
const handleClick = () => {
console.log('clicked')
}
const mapThroughTreeItem = () => {
return fileTree.root.map((el, i) => <FileTreeItem
item={el}
key={i}
onClick={handleClick}
/>)
}
if (fileTree) {
return (
<>
{mapThroughTreeItem()}
</>
);
} else {
return (
<>
Loading..
</>
);
}
}
export default App;
最佳答案
FileTreeItem似乎是一个自定义元素,您如何处理此组件内的click事件?
你可能应该有类似
function FileTreeItem({onClick}) {
return (
<div onClick={onClick}></div>
)
}
您不能直接在自定义元素上注册事件,因为事件在DOM中将完全由其呈现实现替换。
关于javascript - 单击组件时,onClick不触发,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/57289994/