如何将图像标记插入html字符串?

如何将图像标记插入html字符串?,html,reactjs,image,text,Html,Reactjs,Image,Text,我在将图像插入html字符串时遇到问题。我使用react js。我从数据库中检索html字符串。 html字符串的示例如下所示: <div align = "justify"> <font face = "Trebuchet MS"> Various regional economic indicators in the third quarter of 2013 tended to slow in aggregate terms.

我在将图像插入html字符串时遇到问题。我使用react js。我从数据库中检索html字符串。 html字符串的示例如下所示:

<div align = "justify"> <font face = "Trebuchet MS"> Various regional economic indicators in the third quarter of 2013 tended to slow in aggregate terms. <br> Indications of improvement in exports that are beginning to appear in most regions are still restrained by relative conditions <br> low commodity prices on the global market are not expected to offset the slowdown in household consumption and investment. Slowing economic growth is predicted to take place in most areas in Sumatra and Jakarta, <br> while Java and Eastern Indonesia (KTI) are projected to show slight growth. <br> <br> Meanwhile, inflation in all regions is recorded higher during the quarter under review as the impact of <br> from the policy on the increase in the price of subsidized fuel oil (BBM) at the end of June 2013 and <br> disruption in food supply. Despite this, inflationary pressures began to ease at the end of the quarter under review as food supply constraints began to be overcome, particularly for <br> commodities onions and chilies, as well as additional supply of imported meat. At the end of the <br> quarter, food inflationary pressure was even lower in several regions in Sulawesi, Maluku and Nusa Tenggara due to deep price corrections for fresh fish commodities. <br> <br> <span style = "font-size: 11pt; color: rgb (31, 73, 125);" lang = "IN"> The material can be downloaded from the website address Bank Indonesia official. </span> <br> </div>
import React from "react";
import "./styles.css";
const test =
  '<div align = "justify"> <font face = "Trebuchet MS"> Various regional economic indicators in the third quarter of 2013 tended to slow in aggregate terms. <br> Indications of improvement in exports that are beginning to appear in most regions are still restrained by relative conditions <br> low commodity prices on the global market are not expected to offset the slowdown in household consumption and investment. Slowing economic growth is predicted to take place in most areas in Sumatra and Jakarta, <br> while Java and Eastern Indonesia (KTI) are projected to show slight growth. <br> <br> Meanwhile, inflation in all regions is recorded higher during the quarter under review as the impact of <br> from the policy on the increase in the price of subsidized fuel oil (BBM) at the end of June 2013 and <br> disruption in food supply. Despite this, inflationary pressures began to ease at the end of the quarter under review as food supply constraints began to be overcome, particularly for <br> commodities onions and chilies, as well as additional supply of imported meat. At the end of the <br> quarter, food inflationary pressure was even lower in several regions in Sulawesi, Maluku and Nusa Tenggara due to deep price corrections for fresh fish commodities. <br> <br> <span style = "font-size: 11pt; color: rgb (31, 73, 125);" lang = "IN"> The material can be downloaded from the website address Bank Indonesia official. </span> <br> </div>';
export default function App() {
  return (
    <div className="App">
      <h1>Hello CodeSandbox</h1>
      <h2>Start editing to see some magic happen!</h2>
      <div className="content" dangerouslySetInnerHTML={{ __html: test }}></div>
    </div>
  );
}

<img src="img_chania.jpg" alt="Flowers in Chania">
2013年第三季度各地区经济指标总体上趋于放缓
大多数地区开始出现的出口改善迹象仍然受到相对条件的限制
全球市场上商品价格的低水平预计无法抵消家庭消费和投资的放缓。预计苏门答腊和雅加达大部分地区的经济增长将放缓,
而爪哇和印度尼西亚东部(KTI)预计将出现轻微增长

同时,由于2013年6月底补贴燃料油(BBM)价格上涨政策的影响和食品供应中断,
在本报告所述季度,所有地区的通货膨胀率均较高。尽管如此,随着食品供应限制开始被克服,通胀压力在本报告季度末开始缓解,尤其是洋葱和辣椒,以及进口肉类的额外供应。在本季度末,由于鲜鱼商品价格大幅调整,苏拉威西岛、马卢库和努沙登加拉岛几个地区的食品通胀压力甚至更低

该材料可从印度尼西亚银行官方网站下载
,我想在HTML字符串中间添加一个图像。有人有解决办法吗


感谢大家的帮助

您可以使用
危险的西丁神经HTML
。在您的情况下,它将是这样的:

<div align = "justify"> <font face = "Trebuchet MS"> Various regional economic indicators in the third quarter of 2013 tended to slow in aggregate terms. <br> Indications of improvement in exports that are beginning to appear in most regions are still restrained by relative conditions <br> low commodity prices on the global market are not expected to offset the slowdown in household consumption and investment. Slowing economic growth is predicted to take place in most areas in Sumatra and Jakarta, <br> while Java and Eastern Indonesia (KTI) are projected to show slight growth. <br> <br> Meanwhile, inflation in all regions is recorded higher during the quarter under review as the impact of <br> from the policy on the increase in the price of subsidized fuel oil (BBM) at the end of June 2013 and <br> disruption in food supply. Despite this, inflationary pressures began to ease at the end of the quarter under review as food supply constraints began to be overcome, particularly for <br> commodities onions and chilies, as well as additional supply of imported meat. At the end of the <br> quarter, food inflationary pressure was even lower in several regions in Sulawesi, Maluku and Nusa Tenggara due to deep price corrections for fresh fish commodities. <br> <br> <span style = "font-size: 11pt; color: rgb (31, 73, 125);" lang = "IN"> The material can be downloaded from the website address Bank Indonesia official. </span> <br> </div>
import React from "react";
import "./styles.css";
const test =
  '<div align = "justify"> <font face = "Trebuchet MS"> Various regional economic indicators in the third quarter of 2013 tended to slow in aggregate terms. <br> Indications of improvement in exports that are beginning to appear in most regions are still restrained by relative conditions <br> low commodity prices on the global market are not expected to offset the slowdown in household consumption and investment. Slowing economic growth is predicted to take place in most areas in Sumatra and Jakarta, <br> while Java and Eastern Indonesia (KTI) are projected to show slight growth. <br> <br> Meanwhile, inflation in all regions is recorded higher during the quarter under review as the impact of <br> from the policy on the increase in the price of subsidized fuel oil (BBM) at the end of June 2013 and <br> disruption in food supply. Despite this, inflationary pressures began to ease at the end of the quarter under review as food supply constraints began to be overcome, particularly for <br> commodities onions and chilies, as well as additional supply of imported meat. At the end of the <br> quarter, food inflationary pressure was even lower in several regions in Sulawesi, Maluku and Nusa Tenggara due to deep price corrections for fresh fish commodities. <br> <br> <span style = "font-size: 11pt; color: rgb (31, 73, 125);" lang = "IN"> The material can be downloaded from the website address Bank Indonesia official. </span> <br> </div>';
export default function App() {
  return (
    <div className="App">
      <h1>Hello CodeSandbox</h1>
      <h2>Start editing to see some magic happen!</h2>
      <div className="content" dangerouslySetInnerHTML={{ __html: test }}></div>
    </div>
  );
}

<img src="img_chania.jpg" alt="Flowers in Chania">
注意:对于添加图像,您可以将字符串拆分到要追加的位置,然后简单地再次加入。就像在普通js上一样


以下是

尝试以下方法:

<div align = "justify"> <font face = "Trebuchet MS"> Various regional economic indicators in the third quarter of 2013 tended to slow in aggregate terms. <br> Indications of improvement in exports that are beginning to appear in most regions are still restrained by relative conditions <br> low commodity prices on the global market are not expected to offset the slowdown in household consumption and investment. Slowing economic growth is predicted to take place in most areas in Sumatra and Jakarta, <br> while Java and Eastern Indonesia (KTI) are projected to show slight growth. <br> <br> Meanwhile, inflation in all regions is recorded higher during the quarter under review as the impact of <br> from the policy on the increase in the price of subsidized fuel oil (BBM) at the end of June 2013 and <br> disruption in food supply. Despite this, inflationary pressures began to ease at the end of the quarter under review as food supply constraints began to be overcome, particularly for <br> commodities onions and chilies, as well as additional supply of imported meat. At the end of the <br> quarter, food inflationary pressure was even lower in several regions in Sulawesi, Maluku and Nusa Tenggara due to deep price corrections for fresh fish commodities. <br> <br> <span style = "font-size: 11pt; color: rgb (31, 73, 125);" lang = "IN"> The material can be downloaded from the website address Bank Indonesia official. </span> <br> </div>
import React from "react";
import "./styles.css";
const test =
  '<div align = "justify"> <font face = "Trebuchet MS"> Various regional economic indicators in the third quarter of 2013 tended to slow in aggregate terms. <br> Indications of improvement in exports that are beginning to appear in most regions are still restrained by relative conditions <br> low commodity prices on the global market are not expected to offset the slowdown in household consumption and investment. Slowing economic growth is predicted to take place in most areas in Sumatra and Jakarta, <br> while Java and Eastern Indonesia (KTI) are projected to show slight growth. <br> <br> Meanwhile, inflation in all regions is recorded higher during the quarter under review as the impact of <br> from the policy on the increase in the price of subsidized fuel oil (BBM) at the end of June 2013 and <br> disruption in food supply. Despite this, inflationary pressures began to ease at the end of the quarter under review as food supply constraints began to be overcome, particularly for <br> commodities onions and chilies, as well as additional supply of imported meat. At the end of the <br> quarter, food inflationary pressure was even lower in several regions in Sulawesi, Maluku and Nusa Tenggara due to deep price corrections for fresh fish commodities. <br> <br> <span style = "font-size: 11pt; color: rgb (31, 73, 125);" lang = "IN"> The material can be downloaded from the website address Bank Indonesia official. </span> <br> </div>';
export default function App() {
  return (
    <div className="App">
      <h1>Hello CodeSandbox</h1>
      <h2>Start editing to see some magic happen!</h2>
      <div className="content" dangerouslySetInnerHTML={{ __html: test }}></div>
    </div>
  );
}

<img src="img_chania.jpg" alt="Flowers in Chania">


关于研究的更多细节:

我认为问题在于如何在
html
中插入字符串并在中呈现react@ShubhamVerma是的,你是对的。。。谢谢你的澄清谢谢你的回答。但是如何在文本中间做分裂。例如,有两个段落,我想将它们分为两个段落。你能在沙盒链接中更新你的要求吗?@Zenryo我已经更新了我的沙盒链接。你想要这样的东西吗?