react如何查看事件
查看 React 事件的方法
使用 console.log 打印事件对象
在事件处理函数中，可以直接打印事件对象到控制台。例如，点击事件可以通过以下方式查看：
const handleClick = (event) => {
console.log('Event details:', event);
};
<button onClick={handleClick}>Click Me</button>使用 React DevTools 检查事件
React DevTools 是浏览器扩展工具，可以检查组件的事件处理函数。安装后，在浏览器开发者工具中选择 React 组件，查看 props 中的事件绑定（如 onClick、onChange）。
事件对象的常用属性
React 事件是合成事件（SyntheticEvent），常见属性包括：
event.target：触发事件的 DOM 元素。event.currentTarget：当前处理事件的 DOM 元素。event.type：事件类型（如"click"）。
const handleChange = (event) => {
console.log('Input value:', event.target.value);
};使用 debugger 语句调试
在事件处理函数中插入 debugger，浏览器会暂停执行并进入调试模式，可以逐步查看事件对象：
const handleSubmit = (event) => {
debugger; // 调试断点
event.preventDefault();
};查看事件冒泡和捕获阶段
通过 event.nativeEvent 可以访问原生 DOM 事件，分析事件传播阶段：
const handleDivClick = (event) => {
console.log('Native event phase:', event.nativeEvent.eventPhase);
};注意事项
- React 事件是跨浏览器封装的对象，与原生事件不完全相同。
- 异步代码中需调用
event.persist()保留事件对象，否则属性会被回收。
