react-markdown-mirror

    1.0.7 • Public • Published

    react-markdown-editor

    A convenient React.js markdown editor component,Type Markdown on the left and you can preview in real-time on the right panel.

    Demo

    Install

    npm install --save react-markdown-mirror

    Usage

    import React from 'react';
    import ReactDOM from 'react-dom';
    import Markdown from 'react-markdown-mirror';
     
    ReactDOM.render(<Markdown />, document.getElementById('root'));

    Props

    Name Type Value Discription
    title Boolean true or false,default true show or hide
    Object {visible:Boolean,defaultValue:String,maxLength:Number} set title visible, default value and max length
    toolbar Boolean true or false,default true show or hide
    defaultValue String string markdown string value
    onChange Function value=>{} triggered when you input
    debounceTime Number number(ms),default 500ms wait for converting
    extra ReactNode ReactNode operating area, at the end of the line of the Toolbar line
    containerClassName String string the wrapper classname
    inputClassName String string the input area classname
    outputClassName String string the output area classname

    Get value

    1.use onChange prop,you can do something on this callback

    <Markdown onChange={value => console.log(value)} />

    2.use ref

    const App = () => {
      const markdown = useRef();
      useEffect(() => {
        const value = markdown.current.getValue();
        console.log(value);
      });
      return <Markdown ref={markdown} />;
    };

    Set value

    also use ref

    const App = () => {
      const markdown = useRef();
      useEffect(() => {
        const defaultTitle = 'default title';
        const defaultMarkdown = '# This is default markdown';
        markdown.current.setValue({ title: defaultTitle, markdown: defaultMarkdown });
      }, []);
      return <Markdown ref={markdown} />;
    };

    Install

    npm i react-markdown-mirror

    DownloadsWeekly Downloads

    1

    Version

    1.0.7

    License

    MIT

    Unpacked Size

    995 kB

    Total Files

    30

    Last publish

    Collaborators

    • zhangyu1995