экспортный класс реакции с AJAX

Question

У меня есть приведенный ниже код, чтобы убедиться, что код работает.Теперь, когда у меня это работает, я пытаюсь экспортировать его на свою страницу индекса, используя следующее:.Может ли кто-нибудь предоставить руководство относительно того, как я могу экспортировать его?

class EmployeeRow extends React.Component {
    render() {
        return (
            <tr>
                <td>{this.props.item.AccountID}</td>
                <td>{this.props.item.AccountName}</td>
                <td>{this.props.item.SenderName}</td>
                <td>{this.props.item.SenderEmail}</td>
                <td>{this.props.item.ITEmailReceipients}</td>
                <td>{this.props.item.Active}</td>
            </tr>
        );
    }
} 
 class EmployeeTable extends React.Component {
    state = {
        result: []
    }

    render() {
        var rows = [];
        this.state.result.forEach(function (item) {
            rows.push(<EmployeeRow key={item.AccountID} item={item} />);
        });
        return (
            <table className="table">
                <thead>
                    <tr>
                        <th>EmployeeID</th>
                        <th>FirstName</th>
                        <th>LastName</th>
                        <th>Gender</th>
                        <th>Designation</th>
                        <th>Salary</th>
                    </tr>
                </thead>

                <tbody>
                    {rows}
                </tbody>
        </table>);
    }

    componentDidMount() {
        var xhr = new XMLHttpRequest();
        xhr.open('get', this.props.url, true);
        xhr.onload = function () {
            var response = JSON.parse(xhr.responseText);
            this.setState({ result: response });
        }.bind(this);
        xhr.send();
    }
}

ReactDOM.render(<EmployeeTable url="GetEmployeeData" />,
    document.getElementById('griddata')
);

Index.js

import React, {Component, Fragment} from 'react';
import { render } from 'react-dom';
import ReactDOM from 'react-dom';
import {
    BrowserRouter as Router,
    Route,
    Link
} from 'react-router-dom';

import GSC from './GSC';
import Intro from './Intro';

class App extends Component {
    render() {
        return (
            <Router>
            <div className="App">

                <Route exact path='/' component={Intro} />
                <Route exact path='/Home/GSC' render={() => <EmployeeTable url="GetEmployeeData" />} />

            </div>
            </Router>
        );
    }
}

ReactDOM.render(<App />, document.getElementById('app'));

Как видите, я использую маршрутизатор, поэтому, когда пользователь находится на странице индекса, он отображает сообщение оттуда.И когда пользователь нажимает на URL, он переносит их на сайт / Home / GSC.Этот сайт GSC не отображается при экспорте в файл Index.js.Любые идеи о том, почему это происходит и как это решить?

Answer 1

<Route exact path='/Home/GSC' render={() => <EmployeeTable url="GetEmployeeData" />} /> 

Как утверждает Толле.