React-mustache-template-component NPM

npm type definitions

React Mustache Template Component

The Template component that uses Mustache.js to render the a component, sanitized by dompurify.

Demo

Installation and Usage

$ npm install react-mustache-template-component

The use it in your app:

import TemplateComponent from 'react-mustache-template-component'

...
const template = `<img class="img" src="{{url}}" />`;
const data = { url: 'http://example.com/img' };

<TemplateComponent template={template} data={data} />

This will be rendered as

<div><img class="img" src="http://example.com/img" /></div>

Notes

Input is properly sanitized by dompurify. This can be switched off (... sanitize={false} ...) but is highly discouraged, as this might introduce XSS issues

Props

Props that are used:

Name	Required	Type	Default	Comments
template	Yes	string	-	Mustache template string that is used in your template component
data	No	object	`{}`	Data used by Mustache to replace placeholders (marked by `{{}}`)
type	No	string	`"div"`	Type of container. Can be any HTMLElement, like `div`, `span`, `i` etc
sanitize	No	boolean	true	Sanitize the result using `dompurify`
sanitizeOptions	No	object	{}	Sanitation can be changed by Dompurify.Config options