Javascript 如何使用react devtools将函数绑定到onClick事件侦听器

我想使用react devtools查看网站上onClick函数的源代码，具体来说

请注意，我对react devtools还不熟悉，对其工作原理还没有很好的理解。我花了大约两个小时试图弄明白这一点

在目的地字段之间的站点上，有一个图像标记，单击该标记时，它会更改目的地的顺序：

我想使用react devtools查找代码，看看它是如何工作的

当我在react-dev工具中打开它时，我可以看到以下内容：

当我展开onClick选项卡时，它不会显示任何内容

为什么？为什么在这个选项卡中我看不到onClick所绑定的函数

当我退一步查看组件时，我可以看到包含此功能的组件的道具：

但我不知道如何或在哪里找到负责切换两个输入字段的函数

Google搜索“get-onclick function react-devtools”和相关关键字，对于在react上下文中查看绑定到eventlistener的函数，并没有提供有用的结果，只是提供了一个简单的JS

---

在React和React开发工具的上下文中，如何看待绑定到事件侦听器的函数？

开始此任务的一种方法是设置一个

进入devtools中的“源”选项卡，展开“事件侦听器断点”，找到并展开“鼠标”，然后选择“单击”。这将导致该页面上的代码暂停执行，您可以检查所涉及的代码

我在您提供的网站上尝试了这一点，发现代码被缩小/模糊，正如您所料，这使得调试和反向工程变得困难，但并非不可能

---

哦，好吧，我不知道这在反应中也是一样的……谢谢你的提示