react-message

a message notice ui component for react

Installation

using npm

npm install rc-message --save

using yarn

yarn add rc-message

Screenshots

Example

https://lijinke666.github.io/react-message/

Development

git clone https://github.com/lijinke666/react-message
npm install | yarn
npm start
open `http://localhost:3000/`

Usage

import Message from "rc-message"
import "rc-message/assets/index.css"
Message.success({
    content:"hello world"
})

API

• Message.success(options)
• Message.error(options)
• Message.info(options)
• Message.warning(options)
• Message.loading(options)
• Message.confirm(options)
• Message.prompt(options)

Options

• options.content

  • Desc : content of the message
  • Type : string | ReactNode
  • Default : -

• options.duration

  • Desc : time before auto-dismiss,in seconds
  • Type : number
  • Default : 2

• options.theme

  • Desc : theme of the message
  • Type : string
  • Default : light

• options.onClose

  • Desc : Specify a function that will be called after the message closed
  • Type : Function
  • Default : -

Special options

Base Options of the confirm() and prompt()

• options.content

  • Desc : content of the message
  • Type : string | ReactNode
  • Default : -

• options.okText

  • Desc : Text of the OK button
  • Type : string
  • Default : Ok

• options.cancelText

  • Desc : Text of the Cancel button
  • Type : string
  • Default : Cancel

• options.onOk

  • Desc : Specify a function that will be called when a user clicked OK buttond
  • Type : Function
  • Default : -

• options.onCancel

  • Desc : Specify a function that will be called when a user clicked mask, close button on top right or cancel button
  • Type : Function
  • Default : -

• Message.prompt(options)

  • options.inputType
    • Desc : input html type of the message
    • Type : string
    • Default : text
  • options.placeholder
    • Desc : input placeholder of the message
    • Type : string
    • Default : -