SPFx - Display Rich Text Field

%3CLINGO-SUB%20id%3D%22lingo-sub-78962%22%20slang%3D%22en-US%22%3ESPFx%20-%20Display%20Rich%20Text%20Field%3C%2FLINGO-SUB%3E%3CLINGO-BODY%20id%3D%22lingo-body-78962%22%20slang%3D%22en-US%22%3E%3CP%3EIs%20there%20a%20way%20in%20a%20webpart%20using%20SharePoint%20Frameworks%20to%20display%20rich%20text%20(from%20a%20list)%20properly%3F%20The%20strings%20I%20want%20to%20use%20contains%20hyperlinks%2C%20line%20breaks%2C%20superscripts...etc.%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CP%3EThe%20only%20solution%20I%20have%20seen%20is%20to%20use%20%22dangerouslySetInnerHTML%22.%20But%2C%26nbsp%3Bthis%20solution%26nbsp%3Bcan%20only%20be%20done%20once%20per%20component%20so%20it%20doesn't%20work%20for%20what%20I%20am%20doing.%20I%20am%20using%20a%20%3CA%20href%3D%22https%3A%2F%2Fdev.office.com%2Ffabric%23%2Fcomponents%2Fdetailslist%22%20target%3D%22_blank%22%20rel%3D%22noopener%20noreferrer%20noopener%20noreferrer%22%3EDetailsList%20%3C%2FA%3Ecompenent%20from%20Office%20UI%20Fabric%20to%20display%20a%20list%20of%20Q%26amp%3BAs.%20The%20answers%20for%20each%20question%20are%20rich%20text.%3C%2FP%3E%3C%2FLINGO-BODY%3E%3CLINGO-LABS%20id%3D%22lingo-labs-78962%22%20slang%3D%22en-US%22%3E%3CLINGO-LABEL%3EDeveloper%3C%2FLINGO-LABEL%3E%3CLINGO-LABEL%3EPnP%3C%2FLINGO-LABEL%3E%3C%2FLINGO-LABS%3E%3CLINGO-SUB%20id%3D%22lingo-sub-78966%22%20slang%3D%22en-US%22%3ERe%3A%20SPFx%20-%20Display%20Rich%20Text%20Field%3C%2FLINGO-SUB%3E%3CLINGO-BODY%20id%3D%22lingo-body-78966%22%20slang%3D%22en-US%22%3EI%20would%20start%20with%20this%20approach%3A%3CBR%20%2F%3E%3CA%20href%3D%22http%3A%2F%2Fveenstra.me.uk%2F2017%2F06%2F07%2Foffice-365-sharepoint-how-to-create-a-form-framework-using-spfx-part-2%2F%22%20target%3D%22_blank%22%20rel%3D%22nofollow%20noopener%20noreferrer%20noopener%20noreferrer%22%3Ehttp%3A%2F%2Fveenstra.me.uk%2F2017%2F06%2F07%2Foffice-365-sharepoint-how-to-create-a-form-framework-using-spfx-part-2%2F%3C%2FA%3E%3CBR%20%2F%3E%3CBR%20%2F%3EThen%20within%20your%20class%20you%20can%20organise%20the%20data%20as%20you%20need%20it.%3CBR%20%2F%3E%3CBR%20%2F%3EI%20havent%20implemented%20the%20rich%20text%20control%20yet.%20But%20there%20shouldn't%20be%20too%20much%20of%20a%20difference%20here.%3C%2FLINGO-BODY%3E
Highlighted
Contributor

Is there a way in a webpart using SharePoint Frameworks to display rich text (from a list) properly? The strings I want to use contains hyperlinks, line breaks, superscripts...etc.

 

The only solution I have seen is to use "dangerouslySetInnerHTML". But, this solution can only be done once per component so it doesn't work for what I am doing. I am using a DetailsList compenent from Office UI Fabric to display a list of Q&As. The answers for each question are rich text.

1 Reply
Highlighted
I would start with this approach:
http://veenstra.me.uk/2017/06/07/office-365-sharepoint-how-to-create-a-form-framework-using-spfx-par...

Then within your class you can organise the data as you need it.

I havent implemented the rich text control yet. But there shouldn't be too much of a difference here.