agGrid 未使用 ag-grid-community 定义
agGrid not defined using ag-grid-community
我正在尝试文档中给出的演示 https://www.ag-grid.com/documentation/javascript/getting-started/
我收到错误 agGrid not defined.I am using html.erb files.Can 有人请告诉我错误是什么。
main.js
import { Grid } from 'ag-grid-community';
var columnDefs = [
{ field: "make" },
{ field: "model" },
{ field: "price" }
];
// specify the data
var rowData = [
{ make: "Toyota", model: "Celica", price: 35000 },
{ make: "Ford", model: "Mondeo", price: 32000 },
{ make: "Porsche", model: "Boxter", price: 72000 }
];
// let the grid know which columns and what data to use
var gridOptions = {
columnDefs: columnDefs,
rowData: rowData
};
// setup the grid after the page has finished loading
document.addEventListener('DOMContentLoaded', function() {
var gridDiv = document.querySelector('#myGrid');
new agGrid.Grid(gridDiv, gridOptions);
});
index.html.erb
<div class="collections_data text-center">
<div id="myGrid" class="ag-theme-alpine"></div>
</div>
有两种方法可以解决这个问题:
- 将
import { Grid } from 'ag-grid-community';
更改为 import * as agGrid from "ag-grid-community";
或
- 将
new agGrid.Grid(gridDiv, gridOptions);
更改为new Grid(gridDiv, gridOptions);
这是一个在 vanilla js 中显示此内容的示例:https://stackblitz.com/edit/js-6yuwqn?file=index.js
我正在尝试文档中给出的演示 https://www.ag-grid.com/documentation/javascript/getting-started/ 我收到错误 agGrid not defined.I am using html.erb files.Can 有人请告诉我错误是什么。 main.js
import { Grid } from 'ag-grid-community';
var columnDefs = [
{ field: "make" },
{ field: "model" },
{ field: "price" }
];
// specify the data
var rowData = [
{ make: "Toyota", model: "Celica", price: 35000 },
{ make: "Ford", model: "Mondeo", price: 32000 },
{ make: "Porsche", model: "Boxter", price: 72000 }
];
// let the grid know which columns and what data to use
var gridOptions = {
columnDefs: columnDefs,
rowData: rowData
};
// setup the grid after the page has finished loading
document.addEventListener('DOMContentLoaded', function() {
var gridDiv = document.querySelector('#myGrid');
new agGrid.Grid(gridDiv, gridOptions);
});
index.html.erb
<div class="collections_data text-center">
<div id="myGrid" class="ag-theme-alpine"></div>
</div>
有两种方法可以解决这个问题:
- 将
import { Grid } from 'ag-grid-community';
更改为import * as agGrid from "ag-grid-community";
或
- 将
new agGrid.Grid(gridDiv, gridOptions);
更改为new Grid(gridDiv, gridOptions);
这是一个在 vanilla js 中显示此内容的示例:https://stackblitz.com/edit/js-6yuwqn?file=index.js