Question

我正在构建一个用于处理远程HTML内容的React应用程序。

事实上，我们正在使用WYSIWYG的后台，所以我需要在我的反应应用程序中检索它。

它适用于＆＃34;标准＆＃34;诸如<p>，<div>等内容...

实际上，我想基于推特创建内容，比如在我的应用程序页面中嵌入推文的时间轴。

以下是我从后端API获取的HTML：

<div>
  <a class="twitter-timeline" href="https://twitter.com/twitterAccount">Tweets by Twitter Account</a>
  <script async src="//platform.twitter.com/widgets.js" charset="utf-8"></script>
</div>

没有比twitter提供的嵌入内容更多/更少的东西。

当我试图把它放进去时：

<div dangerouslySetInnerHTML={content}/>

它不会在屏幕上提供任何内容（链接除外），但不提供时间轴，就像是（并且我确定因为这样）脚本标记不是执行。

然而，这些东西存在于我的DOM中，看起来很像：

<div>
  <a class="twitter-timeline" href="https://twitter.com/user">Tweets by User</a><br>
  <script async="" src="//platform.twitter.com/widgets.js" charset="utf-8"></script>
</div>

是否存在使该脚本执行的方法？

Answer 1

您可以阅读脚本标记中的src属性，使用网址发送请求并加载eval()文本，但这远非推荐。

您是否始终期望在html中显示相同的脚本标记？也许包括

<script async="" src="//platform.twitter.com/widgets.js" charset="utf-8"></script>

页面中的

可以正常使用

反应危险的SetInnerHTML和脚本标记

1 个答案: