时间戳

首页 > 解决方案 > 如何在 React/NextJS 中嵌入第三方弹出按钮脚本

javascript - 如何在 React/NextJS 中嵌入第三方弹出按钮脚本

问题描述

我有一个由 Wordpress 提供支持的 NextJS 网站。我有一个用户在 WP 的文本框中输入的按钮代码，然后当 Next 构建站点时，它会显示代码。

我遇到的问题是我的按钮出现了，但是当用户单击该按钮时没有任何反应。

按钮代码

<button class='flybook-book-now-button fb-widget-type-frontend fb-default-category-id-0 fb-account-id-687 fb-entity-config-id-15549 fb-domain-go.theflybook.com fb-protocol-https' style='background-color: #ee5505;'>BOOK NOW</button><link rel='stylesheet' href='https://go.theflybook.com/content/bootstrapper/flybookbootstrap.css' /><script src='https://go.theflybook.com/custom/bootstrapper/flybookbootstrap.js'></script>

在我的组件中，我像这样使用“dangerously-set-html-content”渲染文件

          <>
            {title && <h2 className={styles.title}>{title}</h2>}
            {subheader && <h3 className={styles.subheader}>{subheader}</h3>}
            {body && <p className={styles.body}>{body}</p>}
            <InnerHTML html={buttonCode} />
          </>

这将显示按钮，但是当我单击它时，我应该会弹出一个但没有任何反应。

寻找解决方案，我需要在每页上做大约 6 个.....

标签： javascriptreactjsnext.jsembed

解决方案

推荐阅读