將使用 create-react-app 創建的 React 應用程序集成到外部應用程序中

Question

我正在使用create-react-app-typescript創建一個反應應用程序。 我要做的是build應用程序，然后將生成的js和CSS文件包含到另一個應用程序中（這是一個非常老的應用程序，對 React 或任何新的 JavaScript 功能一無所知）

我的問題：我希望能夠將信息傳遞給我的 React 應用程序； 例如，我想指定一個數組用於顯示信息，但問題是，只要我在 React 的js文件中添加<script>標簽，它就會嘗試在目標div元素下創建應用程序。

不確定這是否是個好主意，但我盡量避免eject我的 React 應用程序，這樣我就不需要自己維護所有東西。

我想到的一個解決方案是在localStorage創建一個項目，然后從我的 React 應用程序中讀取它，這以某種方式解決了問題，但這是一個好方法嗎？

然后還有另一個問題：我希望能夠從外部應用程序傳遞一個回調，以便從我的 React 應用程序調用，以導致我的外部應用程序中發生某些事情，而這不能使用localStorage來完成

非常感謝任何幫助或提示，謝謝

Answer 1

您根本不必彈出項目。 一種可能的解決方案（可能不是最好的）只是更改您的index.js以公開您的應用程序。 因此，不是直接“渲染”應用程序，而是執行以下操作

// needed imports

window.startFromOutside = function(element, callback) {
  ReactDOM.render(<ReactApp cb={callback} />, element)
}

這樣你就可以從外部引導你的 React 應用程序，傳遞你想要的任何屬性。