Как включить копирование текста в сетке React, построенной с использованием React-Data-Grid - PullRequest
0 голосов
/ 06 апреля 2020

Я использую React-Data-Grid для отображения моих данных в таблице, но функция копирования не работает.

Ниже представлен мой компонент Grid в React, в котором я подключил его к Back. конец API, а также с React Redux Store.

Table Created using React-Data-Grid

import React, { Component, useState, useEffect } from "react";
import { connect } from "react-redux";
import ApiHelper from "../../api/ApiHelper";
import ReactDataGrid from "react-data-grid";
import { Toolbar, Data, Filters } from "react-data-grid-addons";
import JarvisSpinner from "../presentationalComponents/JarvisSpinner";
import { withRouter } from "react-router-dom";
import "../../css/styles.css";
import "../../css/JarvisGrid.css";

const JarvisGrid = props => {
  const [pagesize, setPageSize] = useState(15);
  const [data, setdata] = useState([]);
  const [filters, setFilters] = useState({
    filterfield: "Application Send",
    filtervalue: "Base"
  });
  const [sort, setSort] = useState({
    Field: "PublicOrderNumber",
    Direction: "desc"
  });
  const [loading, setloading] = useState(true);

  useEffect(() => {
    //Set data
    ReloadData();
  }, [props.uid, props.CalendarDates.fromDate, props.CalendarDates.toDate]);
  
  const ReloadData = () => {
    ApiHelper.GetGridQueryResult(
      props.uid,
      props.filterField,
      props.filterValue,
      props.CalendarDates.fromDate,
      props.CalendarDates.toDate
    )
      .then(response => {
        console.log("response");
        console.log(response);
        console.log(response.status);
        console.log("Checking the data");
        console.log(response.data.responses);
        setdata(response.data.responses);
        setloading(false);
      })
      .catch(error => {
        setdata([]);
        switch (error.response.status) {
          case 403:
            console.log("Error code --> " + 403);
            props.history.push("/unAuthorizedPage");
            break;
          default:
            console.log("Error String --->" + error);
        }
      });
  };

  return (
    <>
      {loading ? (
        <JarvisSpinner size="3x" />
      ) : (
        <div className="JarvisGrid">
          <ReactDataGrid
            columns={props.columns}
            rowGetter={i => data[i]}
            rowsCount={data.length}
            minHeight={500}
            uid={props.uid}
            enableRowSelect={null}
            enableCellSelect
            toolbar={<Toolbar enableFilter="true" />}
            onAddFilter={filter => {
              setFilters({
                filterfield: filter.column.key,
                filtervalue: filter.filterTerm
              });
            }}
            onClearFilters={() =>
              setFilters({
                filterfield: "OrderType",
                filtervalue: "Base"
              })
            }
            onGridSort={(sortColumn, sortDirection) => {
              setSort({ Field: sortColumn, Direction: sortDirection });
            }}
          />
        </div>
      )}
    </>
  );

 
};

function mapStateToProps(state) {
  return {
    CalendarDates: state.calendarDates
  };
}

export default withRouter(connect(mapStateToProps)(JarvisGrid));

Дайте мне знать, если мне нужно передать какие-либо реквизиты в таблицу данных React, которые я мог пропустить

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...