React-Component-Markdown

Markdown component build with React.

Documentation

Installation

npm

npm install react-component-markdown --save

Component

Markdown

The component is to generate a markdown editor that can be edited in real time.

import React from 'react'
import Markdown from 'react-component-markdown'

class Simple extends React.Component {
  render() {
    const markdownValue = '# Title'
    return (<Markdown defaultValue={markdownValue} />)
  }
}

Props

MarkdownView

This component is used to preview articles.

import React from 'react'
import { MarkdownView } from 'react-component-markdown'

class Simple extends React.Component {
  render() {
    const markdownValue = '# Title'
    return (<MarkdownView type="markdown" data={markdownValue} />)
  }
}

MarkdownTool

This component provide the editor toolbar for the user by default and need to work with the editor.

import React from 'react'
import { MarkdownTool } from 'react-component-markdown'

class Simple extends React.Component {
  render() {
    return (<MarkdownTool onChange={(val) => {console.log(val)}} />)
  }
}

Development

Want to run demos locally

npm install
npm start
open http:localhost:6006