index.js 1.4 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647
  1. import React from 'react'
  2. import ReactDOM from 'react-dom'
  3. import Notify from './notify'
  4. /***
  5. * 信息提示框组件
  6. * author: zxc@2018-11-28
  7. * 接收参数:
  8. * type: 信息提示框类型, 包括success、error、info。
  9. * content: 信息提示框文本内容
  10. * duration: 自动关闭的延时,单位毫秒。默认2000毫秒,设为 0 时不自动关闭。
  11. * 用法如下:
  12. * Notify.success('删除成功')
  13. ***/
  14. function createNotification() {
  15. const div = document.createElement('div')
  16. document.body.appendChild(div)
  17. const notification = ReactDOM.render(<Notify />, div)
  18. return {
  19. addNotice(notice) {
  20. return notification.addNotice(notice)
  21. },
  22. destroy() {
  23. ReactDOM.unmountComponentAtNode(div)
  24. document.body.removeChild(div)
  25. }
  26. }
  27. }
  28. let notification
  29. const notice = (type, content, duration=2000, onClose) => {
  30. if (!notification) notification = createNotification()
  31. return notification.addNotice({ type, content, duration, onClose })
  32. }
  33. export default {
  34. info(content, duration, onClose) {
  35. return notice('info', content, duration, onClose)
  36. },
  37. success(content = '操作成功', duration, onClose) {
  38. return notice('success', content, duration, onClose)
  39. },
  40. error(content, duration , onClose) {
  41. return notice('error', content, duration, onClose)
  42. }
  43. }