Блог

Попытка создать блог, импортированный из другого файла. Вот как это выглядит.

 blogs: [
    {
        _id: '5',
        title: "Example",
        text: "This is An example. I want to separate these two lines.",
    },
]
 

Я не уверен, как разместить метку между двумя предложениями. Например, я хочу, чтобы это было похоже

 blogs: [
    {
        _id: '5',
        title: "Example",
        text: "This is An example. <br > I want to separate these <strong>two</strong> lines.",
    },
]
 

Результат зачитывается в виде обычного текста

 This is An example. <br > I want to separate these <strong>two</strong> lines.
 

Я попробовал несколько комбинаций различных кавычек (одинарные кавычки, двойные кавычки и обратные ссылки), но не смог найти решение, и поиск в Google не сильно помог.

Вы можете преобразовать text его в элемент, избавившись от кавычек и заключив его в элемент. Вы можете использовать любые элементы, такие как div , React.Fragmenet (<>/) .

 {
    _id: '5',
    title: "Example",
    text: <>This is An example. <br /> I want to separate these <strong>two</strong>lines.</>,
}
 

Другой способ-сделать это опасным. Вы никогда не должны этого делать, если не знаете, что делаете. Я не буду идти дальше, так как это, вероятно, не то, что вы хотите.

вы можете использовать props dangerouslySetInnerHTML для этого элемента

 <p dangerouslySetInnerHTML={{__html: text}} />
 

Вы можете использовать синтаксический анализатор html-реакции, если вы не хотите использовать dangerouslySetInnerHTML атрибут.