Recientemente he estado creando una aplicación para mostrar varios datos de una base de datos, actualmente estoy intentando crear un botón para permitir una comparación entre dos rangos de fechas, mi solución es permitir que el usuario haga clic en comparar y luego agregue una copia adicional de el componente de la aplicación en la pantalla. En mi archivo app.js, he hecho cosas similares usando useStates en los que cambio los datos y el componente se vuelve a representar, pero aquí parece que no hace nada cuando se agrega a la matriz de vistas múltiples. Establecer la matriz por delante representa la copia del componente, sin embargo, la presión del botón no lo hace, supongo que esto se debe a que no se vuelve a procesar cuando la matriz se actualiza debido al uso de ReactDom.render en lugar de devolver un componente como lo hice anteriormente. en App.js y sus componentes.

Código para index.js

 import React from 'react'; import ReactDOM from 'react-dom'; import './index.css'; import App from './App'; import reportWebVitals from './reportWebVitals'; import MenuBar from './components/MenuBar' var multiView = []; var i = 0; var handleDateCompare = (e) => { i++ multiView.push(<App key={"app"+i} dateCompareClick = {handleDateCompare}/>) console.log(multiView); } ReactDOM.render( <React.StrictMode> <MenuBar /> <App dateCompareClick = {handleDateCompare}/> {multiView} </React.StrictMode>, document.getElementById('root') );