Draftjs 输出结果 转换回html（converToHtml）

draft.js 通过convertToRaw 方法输出的JSON内容如何转换回html？
draft.js 没有自带类似 converToHtml 方法，需要依赖第三方包。
如下介绍的两个第三方包都不依赖 draft.js

backdraft-js 是最简单的一个

https://github.com/evanc/backdraft-js

程序只有50多行代码，只能处理行inlineStyleRanges 的转化，非常牛逼高效

var test = {
    "blocks": [{
        "text": "1111111111",
        "inlineStyleRanges": [{"offset": 3, "length": 8, "style": "BOLD"},

            {"offset": 2, "length": 5, "style": "ITALIC"}
        ]
    }]
}
var backdraft = require('backdraft-js');
var markup = {
    'BOLD': ['<span class="BOLD">', '</BOLD>'],
    'ITALIC': ['<span class ="ITALIC">', '</span>']
};
var r = backdraft(test, markup);
console.log(r)

redraft 功能完善

https://github.com/lokiuz/redraft
功能完善，但是输出的是react 对象，不是html，需要依赖react 转化为html
支持行内，和block 的自定义绘制

import React, { Component } from 'react';
import redraft from 'redraft';

const renderers = {
    inline: {
        BOLD: (children, { key }) => <span key={key} className='BOLD'>{children}</span>,
        ITALIC: (children, { key }) => <span key={key} className='ITALIC'>{children}</span>,
    },
    blocks: {
        unstyled: (children) => children.map(child => <p>{child}</p>),
    }
}

export default class RichEditorExample extends React.Component {
    constructor(props) {
        super(props);
    }

    render() {
        var raw = {
            "blocks": [{
                "text": "asdfasfsafsdf",
                "inlineStyleRanges": [{"offset": 3, "length": 8, "style": "BOLD"}, {
                    "offset": 2,
                    "length": 5,
                    "style": "ITALIC"
                }],
                "entityRanges": [],
                'type': "unstyled"
            }, {
                "text": "asdfasfsafsdf",
                "inlineStyleRanges": [{"offset": 3, "length": 8, "style": "BOLD"}, {
                    "offset": 2,
                    "length": 5,
                    "style": "ITALIC"
                }],
                "entityRanges": [],
                'type': "unstyled"
            }]
        }
        const rendered = redraft(raw, renderers);
        if (!rendered) {
            // TODO ERROR
        }
        return (
            <div>
                {rendered}
            </div>
        );
    }
}