All geek questions in one place

Insert HTML snippets without an element container in React

Our React app uses universal rendering. The html / body / head elements of the page are created on the server side using the React component. Usually, we can create the type of elements <script>and <link>in our <head>just fine through the JSX. Unfortunately, things got complicated when we started embedding third-party HTML snippets. These fragments are essentially a string similar '<script src="some/url.js"></script><link rel="stylesheet" href="/some/css">'. Typically, HTML fragments can be injected into some element container through dangerouslySetInnerHTML, but there are no container elements for the <head>HTML document. This forced us to either:

  • Parse HTML snippets (no easy task) and convert them to React elements.
  • Abandon JSX and build the entire contents of our chapter as one big concatenated / template string

Is there a way in the reactor to insert an HTML fragment into a document without a container element?

+6
source share
1 answer

I think the combination of React Helmet for <head>component level installation and Interweave for HTML input / analysis without using dangerouslySetInnerHTMLcan achieve what you are looking for?

0
source

Source: https://habr.com/ru/post/1657680/

More articles:


All Articles