The wrap-md-editor from jy4618272

jy4618272 / wrap-md-editor Goto Github PK

View Code? Open in Web Editor NEW

使用React封装Editor.md，让调用更简单

Makefile 1.26% JavaScript 98.74%

wrap-md-editor's Introduction

React Component Based on Editor.md

The html template should includes the following tags.

css

<link rel="stylesheet" href="https://s0.meituan.net/xm/open-platform-static/editormd/css/editormd.css" />

js

<script src="//s0.meituan.net/xm/static/jquery/1.11.3/jquery.min.js"></script>
<script src="https://s0.meituan.net/xm/open-platform-static/editormd/editormd.js"></script>

Install

npm install wrap-md-editor -S

Example

the edit mode

import React, {Component} from 'react';
import {render} from 'react-dom';
import Editor from 'wrap-md-editor';

render(
    <Editor config={
        {
            markdown: // testEditor.getMarkdown().replace(/`/g, '\\`')
            `## Test
            \`\`\`
            console.log('what can i do for you')
            \`\`\`
            
            # 123123`,
            onload: (editor, func) => {
                let md = editor.getMarkdown();
                let html = editor.getHTML();
                debugger
            }
        }
    }/>,
    document.querySelector('#root')
);

the show mode

import React, {Component} from 'react';
import {render} from 'react-dom';
import Editor from 'wrap-md-editor';

render(
    <Editor.EditorShow config={
        {
            markdown: // testEditor.getMarkdown().replace(/`/g, '\\`')
            `## Test
            \`\`\`
            console.log('what can i do for you')
            \`\`\`
            
            # 123123`
        }
    }/>,
    document.querySelector('#root')
);