React 简易版 全局message方法

import React, { memo } from "react";
import ReactDOM from 'react-dom';


const Message = memo((props) => {
    // console.log('msg:', props)
    return (
        
{props.msg || '已提交'}
) }) let timer = null const messageTip = { show(msg) { let el = document.getElementById('#message-wrap'); // 这一步是必要的的,因为在执行到这里的时候,页面还没有挂载,所以获取不到el节点 if (!el) { el = document.createElement('div') el.style.position = 'absolute' el.style.top = '0' el.style.width = '100%' el.id = 'message-wrap' document.body.append(el) ReactDOM.render(, el); } if (el) { timer = setTimeout(() => { document.body.removeChild(document.getElementById('message-wrap')) }, 3000); } if (!el && timer) { clearTimeout(timer) } }, } export default messageTip

你可能感兴趣的:(React 简易版 全局message方法)