Javascript 将React provider函数添加到全局窗口对象

我想知道将函数放入

窗口

变量是否是一种好的做法

例如：

App.js 如您所见，我在

窗口中添加了
addMessage
和
removeMessage
。
以下是我将如何使用它：

AuthContextProvider.js
或我的应用程序中的任何位置：

ExampleComponent.js
当然，我可以在内容提供者的值中传递
addMessage
和
removeMessage
，但我更喜欢这样做，因为我需要编写更少的代码
我知道使用
window
变量是不好的，而且速度很慢，但这些只是可能每分钟使用一次或两次的零食消息

我想知道这是否是一个好的实践，我应该在生产中这样做。
谢谢你
如果你去没有窗口的“服务器渲染”，你可能会遇到不同设备和浏览器的错误，那么这不是一个好主意。我永远不会在这个appReact中进行ssr。上下文或Redux是更常用的工具。@jmargolisvt如果你再次阅读我的问题，你会看到我已经在使用React.Context了
  ...
  <PageContextProvider>
    <AuthContextProvider>
      <Content />
    </AuthContextProvider>
  </PageContextProvider>
  ...


/**
  * Display Snackbar Messages On Page
  * @param {string} message Message title to be displayed
  * @param {string} status Message Status
  * @param {objext} options Other Options
  * @returns {void}
  */
const addMessage = (message, status = 'success', options = {}) => {
  const m = {
    message,
    status,
    ...options
  };

  setMessages({ ...messages, [new Date().getTime()]: m });
};

/**
  * Display Snackbar Messages On Page
  * @param {string} message Message title to be displayed
  * @param {string} status Message Status
  * @param {objext} options Other Options
  * @returns {void}
  */
const removeMessage = messagekey => {
  const m = messages;
  delete m[messagekey];
  setMessages({ ...m });
};


useEffect(() => {
  window.addMessage = addMessage;
  window.removeMessage = removeMessage;
}, []);

...
  const login = async (email, password) => {
    setAuth(true);
    window.addMessage('You Are successfully Logged In', 'success');
  };
...

...
  window.addMessage('This is example warning message from ExampleComponent', 'warning');
...