Get Enriched MultiLineText Field value without loosing its HTML property and Display it without html tag using spfx pnp/sp

Question

I need to get enriched multi line text field value of a list item in SharePoint online SPFX web-part and display the field value in a table column without loosing its html property also hiding html tag displaying along with the field value.

Currently I get all fields of a list item by using the code:

const siteweb = Web(this.props.site);
let item: [] = await siteweb.lists.getByTitle(this.props.list).items.getById(propKey[this.props.propertybagid]).fieldValuesAsText.get();

Answer 1

If you are using React JS and getting the multi-line field text in HTML tags format then you can bind its value to div element as:

<div dangerouslySetInnerHTML={{__html: this.state.multilineFieldVale}} />;

Where this.state.multilineFieldVale stores the value of your multi-line field.

documentation: React DOM Elements - dangerouslySetInnerHTML.