I"m having trouble dealing with facebook"s ReactJS. Whenever I bởi vì ajax & want khổng lồ display an html data, ReactJS displays it as text. (See figure below)

The data is displayed through the success callback function of the jquery Ajax.

Bạn đang xem: React convert html to text code example

$.ajax( url: url here, dataType: "json", success: function(data) this.setState( action: data.action ) .bind(this));

Is there any easy way to lớn convert this into html? How should I vì it using ReactJS?

Highest score (default) Trending (recent votes count more) Date modified (newest first) Date created (oldest first)

Help us improve our answers.

Are the answers below sorted in a way that puts the best answer at or near the top?

By default, React escapes the HTML khổng lồ prevent XSS (Cross-site scripting). If you really want khổng lồ render HTML, you can use the dangerouslySetInnerHTML property:

React forces this intentionally-cumbersome syntax so that you don"t accidentally render text as HTML & introduce XSS bugs.

I recommend using Interweave created by milesj. Its a phenomenal library that makes use of a number if ingenious techniques to parse and safely insert HTML into the DOM.

Interweave is a react library lớn safely render HTML, filter attributes, autowrap text with matchers, render emoji characters, and much more.

Xem thêm: Cách Ướp Đồ Nướng Ngon Tại Nhà Đảm Bảo Ngon Như Ngoài Hàng, Cách Ướp Thịt Nướng Ngon Nhất Đơn Giản Tại Nhà

Interweave is a robust React library that can:Safely render HTML without using dangerouslySetInnerHTML.Safely strip HTML tags.Automatic XSS & injection protection.Clean HTML attributes using filters.Interpolate components using matchers.Autolink URLs, IPs, emails, and hashtags.Render Emoji và emoticon characters.And much more!

Usage Example:

import React from "react";import Markup from "interweave";const articleContent = "Lorem ipsum dolor laboriosam.

Facere debitis impedit doloremque eveniet eligendi reiciendis ratione obcaecati repellendus culpa? Blanditiis enim cum tenetur non rem, atque, earum quis, reprehenderit accusantium iure quas beatae.

Lorem ipsum dolor sit amet this is a link, click me Sunt ducimus corrupti? Eveniet velit numquam deleniti, delectus reiciendis ratione obcaecatirepellendus culpa? Blanditiis enimcum tenetur non rem, atque, earum quis,reprehenderit accusantium iure quas beatae.

" // this will take the articleContent string & convert it to HTML markup. See: https://milesj.gitbook.io/interweave//to install package using npm, execute the commandnpm install interweave