我正在制作一個招聘頁面，在該頁面中我從 JSON 檔案中獲取值。但在職位描述中，我希望它具有那里給出的換行符和樣式。但一切都在一行中。我嘗試添加兩者<br>但\n不起作用
.json 檔案
{
"job1": {
"title": "Job title 1",
"type": "Full Time",
"tech": ["stack1", "tech", "abc", "xyz"],
"discription": "Lorem ipsum 2 <br> \n dolor sit amet, consectetur adipisicing elit. Veniam id voluptatum, <br> \n consequatur quos corrupti harum magnam architecto, cumque beatae iste tempore natus voluptates iure dicta aliquid explicabo quaerat facere aperiam."
},
"job2": {
"title": "Job Title 2",
"type": "Part Time",
"tech": ["JavaScript", "CSS"],
"discription": "Lorem ipsum 2 dolor sit amet, consectetur adipisicing elit. Veniam id voluptatum, consequatur quos corrupti harum magnam architecto, cumque beatae iste tempore natus voluptates iure dicta aliquid explicabo quaerat facere aperiam."
},
}
Hirings.js（我使用函式動態創建了作業。這是描述部分）
import Hidings from "./Hirings.json";
// function
<div className="job-discription">
<p>Discription:</p>
<p>{Hirings[job].discription}</p>
</div>
// further code
我得到的輸出是
Description:
Lorem ipsum 2 <br> dolor sit amet, consectetur adipisicing elit. Veniam id voluptatum, <br> consequatur quos corrupti harum magnam architecto, cumque beatae iste tempore natus voluptates iure dicta aliquid explicabo quaerat facere aperiam.
預期產出
Description:
Lorem ipsum 2
dolor sit amet, consectetur adipisicing elit. Veniam id voluptatum,
consequatur quos corrupti harum magnam architecto, cumque beatae iste tempore natus voluptates iure dicta aliquid explicabo quaerat facere aperiam.
uj5u.com熱心網友回復：
https://reactjs.org/docs/dom-elements.html#dangerouslysetinnerhtml
嘗試這個：
<div className="job-discription">
<p>Discription:</p>
<div dangerouslySetInnerHTML={{__html: Hirings[job].discription}} />
</div>
轉載請註明出處，本文鏈接：https://www.uj5u.com/ruanti/439972.html
標籤：javascript html css 反应 json