Javascript 在react js中添加属性时是否可以使用jquery样式？

我将api中的html表单作为字符串，我需要在其上添加onSubmit事件，就像在jquery样式中一样，这是否可能以及如何实现

import React from 'react';
import ReactHtmlParser from 'react-html-parser';

class MyForm extends React.Component {
  const htmlForm = "<form><input type='email' name='user[email]' /></form>"; // this taken from API server as string
  const reactForm = ReactHtmlParser(htmlForm);

  // i want to do like this
  reactForm.on('submit', (e) => {
    e.preventDefault();
    console.log('submitted')
  })
}

但它不起作用，有什么想法吗

纯javascript中的另一个想法，但还不起作用。将纯html+javascript转换为react组件时出现问题。我还不知道转换它的最佳库是什么

从“React”导入React； 从“axios”导入axios； 从“react html parser”导入ReactHtmlParser； 类NewChatButton扩展React.Component{ 构造器{ 超级作物； this.handleClick=this.handleClick.bindthis； } handleClick=e=>{ e、 防止违约； this.props.newChatButtonCallback{modal:{body:'loading…}； 获取“/users/rooms/new.json” .thenresponse=>{ const reactForm=ReactHtmlParserresponse.data； const html=new DOMParser.parseFromStringresponse.data，“text/html”.body； const form=html.querySelector'form'； const select=form.querySelector'select'； form.addEventListener'submit'，e=>{ e、 防止违约； 控制台。日志“已提交”； }; select.addEventListener'change'，e=>{ e、 防止违约； 控制台。日志“已更改” } this.props.newChatButtonCallback{ 模态：{ 标题：“Cari导师”， 主体：反应形式 } }; }.catcherror=>console.logerror； } 渲染{ 回来 添加 } } 导出默认的newchat按钮； 您可以从react html解析器使用：

此外，在大多数浏览器上，不需要在单个文本输入表单中使用提交按钮，只需在字段中按Enter键即可提交。但最好有一个

我添加了提交按钮。如果不想显示，可以使用CSS将其隐藏

---

@T.J.Crowder谢谢。但我没有完全明白。转换是React类方法。让我读一下这篇文章并理解它。如果你愿意，请随意编辑我的答案。如果这是在类构造中，那么是的，它很好-它不是一个方法，它是一个具有指定函数的属性。我把它看作是独立的。另外，你需要一个提交按钮来提交表单。在大多数浏览器上，您不需要在单个文本输入表单中输入一个，在字段中按Enter键即可提交。但最好有一个-谢谢我接受这个答案。我上传了另一个完整的版本code@AjeetShah，这不是一个答案，只是另一个角度，它还不起作用，你的解决方案正在起作用，我不想花更多的时间在其他解决方案上，只需要一个有效的解决方案

transform = (node, index) => {
  if (node.type === 'tag' && node.name === 'form') {
    return (
      <form
        key={index}
        {...node.attribs}
        onSubmit={(e) => {
          e.preventDefault()
          e.stopPropagation()
          console.debug('submitted')
        }}
      >
        {node.children.map((child, i) => {
          return <child.name key={i} {...child.attribs}></child.name>
        })}
        <button type="submit">Submit</button>
      </form>
    )
  }
}

render() {
  const htmlForm = "<form><input type='email' name='user[email]' /></form>"
  const reactForm = ReactHtmlParser(htmlForm, { transform: this.transform })

  return (
    <>
      <div>{reactForm}</div>
    </>
  )
}