AG-Grid Column Headers堆叠到左侧

Question

我正在使用ag-grid反应和渲染表时。我将列标题堆叠到左侧。

提供的CSS是：

<div style={{ width: '100%', height: "100vh", marginTop: '5%'}}>
                <div           
                    style={{
                    boxSizing: "border-box",
                    height: "100vh",
                    width: "100%"
                }}
                className="ag-theme-fresh"
                >
                    <AgGridReact
                        id="myGrid"
                        columnDefs={this.columnDef}
                        defaultColDef={this.defaultColDef}
                        onGridReady={this.onGridReady.bind(this)}
                    />
                    
                </div>
</div>

表格如下： Ag-grid column header stacked to left

Answer 1

所以我想出了我的Angular项目。所以他们在简单的入门文档中忘记提到的是你需要导入样式：

// .angular-cli.json
"styles": [
    "../node_modules/ag-grid/dist/styles/ag-grid.css",
    "../node_modules/ag-grid/dist/styles/ag-theme-fresh.css"
],

因此，我建议您在反应应用中找出导入样式的位置。

请参阅我的示例Angular StackBlitz