在 react 中,如何将 jsx 元素放入字符串中,然后让事件侦听器正确呈现



>我在一个小库中遇到问题,正在寻找解决方法,以字符串形式传递html。我在附加事件侦听器时遇到问题(这甚至可能吗(。我想做这样的事情:

library({
    title: `<div onChange={this.function} />`
)}

这会渲染一个div,但不会在 Change.有什么想法吗?

如果你试图将生成的HTML注入到div中,那么你最好开始使用dangerouslySetInnerHTML属性,如下所示:

function createMarkup() { 
    return <SomeJsxComponentHere />
};
<div dangerouslySetInnerHTML={createMarkup()} />

参考:https://zhenyong.github.io/react/tips/dangerously-set-inner-html.html 有关为什么这很重要的更多详细信息。

如果您希望每次调用此 createMarkup(( 函数时都发出一个事件,那么您可以使用标准 JavaScript 来连接事件发射器,或者如果您的计划是渲染可能需要高于正常时间才能呈现的大型标记,则甚至更好,请考虑将此 createMarkup(( 设为一个 promise 函数,这样在 .then(..( 中您就可以完成其余的工作,例如更新状态等

相关内容

  • 没有找到相关文章

最新更新