如何在React中获取通过dangerouslySetInnerHTML添加的子标记的引用

文章/答案/技术大牛

发布

1回答

javascript、html、reactjs

我有一个div，它使用dangerouslySetInnerHTML来设置来自服务器的一些文本。如下所示： <div dangerouslySetInnerHTML={{ __html: preview }}</Wrapper> 类似于<p> Some context </p>的preview内容。我需要访问呈现的p标记</

浏览 7提问于2021-02-20得票数 0

1回答

为什么dangerouslySetInnerHTML属性返回不变性违规错误？

javascript、reactjs、markdown

我正在尝试构建一个使用react和marked.js的简单的减价预告片。感觉我就快到了--我可以console.log标记，但是由于某些原因，我在尝试插入HTML时会出错。以下是代码：const {useState} = React function App(){ } return(

浏览 4提问于2020-05-24得票数 1

回答已采纳

3回答

使用包含不起作用的HTML标记的翻译的I18nTrans组件

reactjs、i18next、react-i18next

我试图在包含一些HTML标记的翻译json中使用，如下所示：{ "welcome": "Welcome to our site, <strong>{{name}}</strong>" }但是，我对如何使用它们

浏览 10提问于2020-04-17得票数 2

回答已采纳

2回答

如何将原始html <a href>标签连接到React* javascript？*

javascript、html、reactjs、dom

我构建了一个小的web应用程序，通过拉取原始的html WikiPedia文章内容(通过it的api)来模拟浏览WikiPedia。然后，我使用"dangerouslySetInnerHTML“在我的应用程序中显示html。我试图弄清楚如何允许用户单击卸载的< ahref="wiki/javascript“>标记，并在React端捕获该事件。我想要捕获标签点

浏览 0提问于2018-04-04得票数 0

3回答

如何使用react呈现<template />标记？

reactjs、web-component、jsx、documentfragment

有时，您可能需要从您的反应应用程序呈现web组件。render() { <template> </template>} 那我的网络组

浏览 0提问于2017-03-16得票数 11

回答已采纳

1回答

在this.state中使用JSX，但它被呈现为纯文本

javascript、reactjs、jsx

根据这些元素中的键值对，我需要在它们前面插入其他元素。import React, { Component } from 'react'; import '.

浏览 1提问于2019-01-01得票数 1

回答已采纳

1回答

如何在使用dangerouslySetInnerHtml呈现内容时使用React链接？

javascript、reactjs、react-router

因此，我正在为react应用程序开发一个博客页面。页面正在从CMS加载数据，博客帖子的内容是原始html，我使用以下命令在页面上呈现它：但是，我在帖子中添加的任何链接，如<a href='/'>Home Page</a>，都不使用react路

浏览 73提问于2018-07-28得票数 14

回答已采纳

1回答

从dangerouslySetInnerHTML延迟加载图像

reactjs、lazy-loading

我有一个超文本标记语言与一堆图片加载到一个使用dangerouslySetInnerHTML的div我试图做的是懒惰地加载图像以提高性能。我尝试了几个包，如，但它似乎并不懒惰地以这种方式加载图像。如果

浏览 16提问于2018-05-23得票数 0

3回答

react使用dangerouslySetInnerHTML来呈现带有html标记的json

javascript、html、json、reactjs、eslint

我正在尝试呈现一个json列表，该列表的字符串中包含html标记，如下所示的。它可以在Jsbin中工作。但在我的控制台中，我收到了以下警告： warning Only set one of `children` or `props.dangerouslySetInnerHTML` react/no-danger-with-children只是想知道是否有其他方法可以用dangerouslySetInnerHTML呈现列表来

浏览 2提问于2017-05-05得票数 6

回答已采纳

1回答

React:从服务器加载内容并呈现到React

reactjs

我想通过request将表单加载到我的ReactApp中。我通过fetch获取内容，然后将内容放入状态，以将其作为子级从组件发布。该示例适用于普通HTML，但不适用于其中包含react组件的html。 class Box extends React.Component { super(props); this.state=> this.setS

浏览 12提问于2020-11-30得票数 0

1回答

如何将字符串中的文本作为目标并添加跨度以对其进行专门编辑？

reactjs、dom、jsx

我有一个字符串，这是动态添加到一个网站的反应应用程序。我如何才能只瞄准Larry这个名字，这样我就可以在它周围加上一个跨度来改变颜色？我尝试了显而易见的line1：“你好，我的名字是拉里，我喜欢克拉比馅饼”……没有工作，line1：“你好，我的名字是++拉里++，我喜欢克拉比馅饼”……不起作用有很多变化，但它们都不起作用。

浏览 10提问于2020-02-24得票数 0

1回答

React将字符串从服务器响应中呈现为html

javascript、reactjs

服务器生成html代码并返回给我，带有脚本标记，我需要将其呈现到我的React组件中。我必须呈现html代码(如dangerouslySetInnerHTML)，并运行脚本标记。你不知道解决方案吗？对不起，我的英语不好。

浏览 0提问于2016-06-28得票数 0

1回答

通过GatsbyJS/ReactJS在OrientationChange上的全屏视频(最佳实践是什么？)

reactjs、gatsby

我正在寻找GatsbyJS/ReactJS添加orientationchange窗口事件侦听器的最佳实践，以便在移动上通过css全屏查看<video>元素。目前，我正在通过包括<script />标记和dangerouslySetInnerHTML来实现一个工作过程。<script>标记和css是实现这一目标的最佳方法吗？import React from 'react

浏览 1提问于2019-05-09得票数 0

回答已采纳

5回答

React:使用dangerouslySetInnerHTML插入脚本标记时不起作用

javascript、html、reactjs、script-tag

我试图将从服务器发送的html设置为使用React中的dangerouslySetInnerHTML属性显示在div中。我还在它里面有脚本标记，并使用在html中定义的函数。我在JSFiddle 中做了错误的例子。({ render: function() { return (<div dangerousl

浏览 6提问于2016-02-24得票数 40

回答已采纳

4回答

React:如何加载和渲染外部html文件？

javascript、html、reactjs、redux

我使用React和Redux构建了一个小型博客应用程序。博客显示帖子页面，其中包含帖子的标题、作者、标签和描述。当单击标题或“阅读更多”按钮时，我希望从本地项目的数据文件夹中加载并呈现包含所有帖子的相应帖子的HTML文件。Redux正在管理博客的状态，用8个不同的帖子加载初始posts.json文件，包括数据文件夹中相应html文件的htmlPath。

浏览 1提问于2016-10-18得票数 40

2回答

在片段内反应dangerouslySetInnerHTML

javascript、reactjs

我有一个用例，在这里我需要格式化一些文本的反应和渲染HTML。下面是我目前正在努力实现的一个例子：import {renderToString} from "react-dom/serverreturn ( <li> <FormatText>{content.first}</FormatTe

浏览 2提问于2020-01-14得票数 4

回答已采纳

3回答

从javascript / ReactJS中的端点提取html值？

javascript、html、jquery、reactjs

我在reactJS中遇到了一个不寻常的场景，端点正在发送一个对象。其中一个键的值为字符串HTML。端点的结果是： "contact_columns": [ "label": "Don't have a policy yet?"因为它在段标签中，所以如何提取它并将其放入变量中。你好，Arjun Sah

浏览 5提问于2020-11-25得票数 0

回答已采纳

1回答

用dangerouslySetInnerHTML执行脚本

reactjs、dangerouslysetinnerhtml

我在几个地方读到，当我们使用React dangerouslySetInnerHTML插入html片段时，脚本不会被执行。这并不让我感到惊讶(这就是我最初做这个测试的原因)，但我想更好地理解我们所说的“脚本不执行”的含义。除了上面的例子外，还有其他类型的脚本可以执行吗？是否有办法完全防止脚本执行，包括嵌入在html事件处理程序中的脚本，就像我的示例中那样?如果脚本标记

浏览 0提问于2020-10-05得票数 1

回答已采纳

1回答

React dangerouslySetInnerHTML仅允许特定的HTML标记

javascript、reactjs、html-rendering

在React中，我需要获取一个JavaScript String并将其显示为HTML。我使用dangerouslySetInnerHTML来完成这项工作，但我希望通过只允许特定的标签(例如ul和li)来更安全地完成这项工作。我如何才能做到这一点呢？在下面的代码中，我只想允许ul和li标记。<p __html: '<ul><li>

浏览 61提问于2021-03-24得票数 1

1回答

如何将这段google对话流代码放入typescript react应用程序中？

javascript、typescript、google-cloud-platform、dialogflow-es、react-typescript

Google Dialog flow提供了将聊天机器人集成到html页面的代码片段。<df-messenger chat-title="FirstTest" language-code="en"

浏览 1提问于2021-08-06得票数 1

点击加载更多