javascript - 将点击事件处理程序附加到通过 dangerouslySetInnerHTML 注入(inject)的链接的模式

Question

所以我们通过 dangerouslySetInnerHTML 注入(inject) HTML 内容。关于将 onclick 事件处理程序附加到注入(inject)的 HTML 中的所有链接的好模式有什么想法吗？或者，我应该在 React 之外使用逻辑来处理这个问题吗？

Answer 1

这是一种方式，但 dangerouslySetInnerHTML 仅用于呈现纯 html。这意味着您的链接应该像纯 HTML 中的所有普通链接一样重定向。
无论哪种方式，这就是@zerkms 所说的。
例如

class MyComponent extends Component {
  showEvent(e) {
    console.log('the event:');
    console.log(e.target.id); //someDiv

  }
  someHtml() {
    return {__html: `<div id="someDiv" style="background-color:yellow;"> First Second </div>`}; 
  }
  render() {
    return <div onClick={this.showEvent} dangerouslySetInnerHTML={this.someHtml()}></div>;
  }
}

在 showEvent 中，您可以验证 id 并执行一些操作。
希望对您有所帮助。