问题
I have the following react container:
import React, { Component } from 'react';
import TicketListContainer from './TicketListContainer';
export default class BrokerTicketListContainer extends Component {
render() {
return <TicketListContainer/>;
}
}
window.BrokerTicketListRender = ReactDOM.render(
<BrokerTicketListContainer />,
document.getElementById('brokerTicketList')
);
and trying to embed it within an JSP:
<div class="row-fluid">
<!-- #sidebar -->
<jsp:include page="brokerLeftNavigationMenu.jsp" />
<%--<script type="text/ng-template" id="helpOnDemand">--%>
<div class="col-xs-12 col-sm-8 col-md-9 col-lg-9">
<div id="brokerTicketList"></div>
<link rel="stylesheet" href="<gi:cdnurl value="/resources/react/broker/build/static/css/main.css"/>">
<script type="text/javascript" src="<gi:cdnurl value="/resources/react/broker/build/static/js/main.js"/>">
</script>
</div>
</div>
</div>
how can I export these react components to be called from within the JSP I am facing an error rn:
Render a Class Component to the DOM Error - Target container is not a DOM element.”
This container is a part of an overall react app that is hosted along with the JSP. With this as it's index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="theme-color" content="#000000" />
<meta
name="description"
content="Web site created using create-react-app"
/>
<title>React App</title>
<link id="favicon" rel="shortcut icon" type="image/x-icon" href="">
<link rel="stylesheet" href="../assets/scss/vendors/uswds-2.4.0/css/uswds.min.css">
<script src="../assets/scss/vendors/uswds-2.4.0/js/uswds.min.js"></script>
</head>
<body>
<noscript>You need to enable JavaScript to run this app.</noscript>
<div id="root"></div>
</body>
</html>
来源:https://stackoverflow.com/questions/62159594/embedding-react-containers-with-jsp