Embedding react containers with JSP

六眼飞鱼酱① 提交于 2021-01-29 15:18:26

问题


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

标签
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!