小编Dir*_*ind的帖子

最近我开始学习与ES5的反应,但现在尝试在我的应用程序中使用Type脚本.任何人都可以告诉我为什么我无法使用{this.props.people}打印值,但是当我使用{this.state.people}时它正在按预期工作.我从这个网站上做了一些例子.请告诉我这里缺少什么？

现场

import * as React from 'react';

class About extends React.Component<any, any> {
    constructor(props: any) {
        super(props);
        console.log(About);
        const people = [];

        for (let i = 0; i < 10; i++) {
            people.push({
                name: i,
                country: i + i
            });
        }

        this.state = {people};
    }
    public render() {
        return (
            <div>
            {this.props.people.map((person: any, index: number) => (
                <p key={index}>Hello, {person.name} from {person.country}!</p>
            ))}
        </div>
        );
    }
}
export default About;

我创建了一个按钮来展开网格中有150行的ag-grid(Enterprise)中的所有行.它在Chrome中运行良好,但它在最新的FF和Edge中显示警告,称该网页使浏览器变慢.有没有更好的方法来扩展所有行？这需要将近10-15秒

HTML

<button (click)="expandAll(expand)">Expand/Collapse</button>  

JavaScript的

this.columnDefs = [
           {
                headerName: "",
                field: "",
                cellRenderer: "group",// for rendering cell
                suppressMenu: true,
                suppressSorting: true
            }
           ]
           // This is how I am creating fullrow width
            this.gridOptions = <GridOptions>{
            isFullWidthCell: function (rowNode) {
            var rowIsNestedRow = rowNode.flower;
            return rowIsNestedRow;
            },
            fullWidthCellRendererFramework: AgGridInventorRowComponent,
            doesDataFlower: function (dataItem) {
            return true;
         }
    public expandAll(value:boolean) {
            if(value) {
                this.gridOptions.api.forEachNode((node) =>{
                    node.setExpanded(true);
                });
            } else {
                this.gridOptions.api.forEachNode((node) =>{
                    node.setExpanded(false);
                });
            }
        }