Gem 一覧へ戻る
benjycui/jsonml-to-react-element(新しいタブで開きます)
主要言語: JavaScript
To convert JsonML to React element.
- star 数
- 41
- watcher 数
- 1
- fork 数
- 4
- issue 数
- 1
- 最終更新
- 2018/05/07
主要言語: JavaScript
To convert JsonML to React element.
To convert JsonML to React Component.
npm install --save jsonml-to-react-element
Basic:
const ReactDOM = require('react-dom'); const toReactElement = require('jsonml-to-react-element'); const title = [ 'h1', 'Hello world!', ]; ReactDOM.render(toReactElement(title), document.getElementById('content'));
With converters:
const React = require('react'); const ReactDOM = require('react-dom'); const toReactElement = require('jsonml-to-react-element'); const website = [ 'section', [ 'header', ... ], [ 'article', [ 'h1', 'Hello world!', ], ], [ 'footer', ... ] ]; const html5to4 = [ [ (node) => ['section', 'header', 'article', 'footer'].indexOf(node[0]) > -1, (node, index) => React.createElement( 'div', { key: index }, node.slice(1).map((child) => toReactElement(child, html5to4)) ) ], ... ]; ReactDOM.render( toReactElement(website, html5to4), document.getElementById('content') );
To convert JsonML to React Component with converters.
Converters which are passed to toReactElement will concat with default converters. It works like switch sentence.
Each item in converters is a pair of functions. The first function is a prediction, and the second function is a processor which take JsonML node and return React Component.
jsonml.js A collection of JsonML tools.
MIT