Question

尽管这不是解决问题的最佳方法，但我确实需要我的React应用程序与jQuery进行交互，直到提出更好的解决方案为止。

在我的入口点组件的HTML页面中，我有一个简单的jQuery侦听器-见下文：

<html>
... // Omitted for brevity
<body>
... // Omitted for brevity
<script type="text/javascript">

   $(".my-class").on("click", function() {
      debugger;
      // We'll do something here
   })

</script>
</body>
</html>

然后，在我的哑组件中，我有以下内容，但它不起作用。单击按钮时，没有达到在侦听器中设置的断点。

const MyComponent = () => {
   return(
      <div>
         <a href="#" className="btn-primary my-class">Click Me!</a>
      </div>
   );
}

export default MyComponent;

有什么想法可以使它正常工作吗？

Answer 1

将您的方法添加到就绪处理程序中：

var user = await FindByIdAsync(userId);

此外，您可以在componentDidMount挂钩中调用jQuery方法：

jQuery(function($) {
  // your code here
});

如果您不想将自己的jquery方法挂接到组件本身中，而只想在html中使用，那么还需要在文件中注入React和ReactDom：

componentDidMount() {
  // your jQuery code here
}

使React组件与jQuery侦听器一起使用

1 个答案: