xsl-awesome
A quite simple way of registering rendering functions for XML nodes, effectively an XSL with javascript functions.
To install
npm i xsl-awesome --save
Example usage
// Import relevant libraries
import { register, render } from 'xsl-awesome';
import React from 'react';
import ReactDOM from 'react-dom';
// Register render functions for specific elements
register('self::section', renderer => (
<div key={ renderer.key() }>
<h1>My first section</h1>
{ renderer.traverse() }
</div>
));
register('self::paragraph', renderer => (
<p key={ renderer.key() }>
{ renderer.traverse() }
</p>
));
register('self::paragraph[@special]', renderer => (
<p key={ renderer.key() }>
***{ renderer.traverse() }***
</p>
));
// Load an XML string from anywhere
const xmlString = `
<section>
<paragraph>My first paragraph</paragraph>
<paragraph>My second paragraph</paragraph>
<paragraph special="true">My special paragraph</paragraph>
</section>
`;
// Render that baby
ReactDOM.render(
<div>{ render(xmlString) }</div>,
document.getElementById('root'));
Yields a DOM like so:
<div>
<h1>My first section</h1>
<p>My first paragraph</p>
<p>My second paragraph</p>
<p>***My special paragraph***</p>
</div>