我正在使用反應,並且希望在其中一個組件中呈現syncfusion網格。但是,我遇到了網格組件之一的問題。未找到網格組件ej。我嘗試了很多方式導入,但是我沒有成功。有沒有人有這個問題,並找到了解決方案? Error Message使用反應從網格同步導入組件ej的問題
示例代碼:
import React, { Component } from "react";
import $ from "jquery";
//This import does not find the component (ej) needed to render the grid
import {ej} from "syncfusion-javascript";
//There are scripts in the index.html file to mount the grid according to
the Syncfusion documentation
class GridSeries extends Component {
constructor() {
super();
this.menuGrid = this.menuGrid.bind(this);
}
//Function responsible for mounting the grid it is called inside my render method
menuGrid() {
$(function() {
$("#Grid").ejGrid({
dataSource: teste,
allowPaging: true,
allowSorting: true,
allowGrouping: true,
allowFiltering: true,
allowReordering: true,
allowMultiSorting: true,
filterSettings: {filterType: "excel"},
toolbarSettings: {showToolbar: true, toolbarItems: [ej.Grid.ToolBarItems.ExcelExport, ej.Grid.ToolBarItems.WordExport, ej.Grid.ToolBarItems.PdfExport]},
columns: [
{type: "checkbox", width: 50},
{field: "OrderID", headerText: "Order ID", width: 75, textAlign: ej.TextAlign.Right},
{field: "CustomerID", headerText: "Customer ID", width: 80},
{field: "EmployeeID", headerText: "Employee ID", width: 75, textAlign: ej.TextAlign.Right},
{field: "Freight", width: 75, format: "{0:C}", textAlign: ej.TextAlign.Right},
{field: "OrderDate", headerText: "Order Date", width: 80, format: "{0:MM/dd/yyyy}", textAlign: ej.TextAlign.Right},
{field: "ShipCity", headerText: "Ship City", width: 110}
],
toolbarClick: function (e) {
this.exportGrid = this["export"];
if (e.itemName == "Excel Export") {
this.exportGrid(window.baseurl + 'api/grid/ExcelExport')
e.cancel = true;
} else if (e.itemName == "Word Export") {
this.exportGrid(window.baseurl + 'api/grid/WordExport')
e.cancel = true;
} else if (e.itemName == "PDF Export") {
this.exportGrid(window.baseurl + 'api/grid/PdfExport')
e.cancel = true;
document.getElementById('container')
}
},
});
});
//Test Base
var teste = [
{Name: "bruno", City: "Brasilia"},
{Name: "bruno1", City: "Riacho Fundo l"},
{Name: "bruno2", City: "Guára"},
{Name: "bruno3", City: "Cruzeiro"}
];
}
render() {
return (
<div className="content-container-fluid">
<div className="row">
<div className="cols-mple-area">
{ this.menuGrid()}
<div id="Grid"></div>
</div>
</div>
</div>
);
}
}
export default GridSeries;
請試着問你的問題在英國或在[葡萄牙堆棧溢出(https://pt.stackoverflow.com/) – glhrmv
我投票關閉這一問題作爲題外話,因爲它不是英文 - 這是一個**英文網站**,請尊重網站的規則! –
郵政編碼使用示例。 –