ag-grid 存在，但在应用 css 时完全不可见

Question

我正在尝试将反应式农业网格放入 meteor 中，但我遇到了一个 css 障碍，但这很奇怪，我不确定也不能熬过去。

如果我不包含 ag-grid 和 ag-theme-fresh css 文件，我的数据会出现并出现——当然，所有格式都非常糟糕——就像这样：

但是如果我包含两个 css 文件，我会得到一个看起来像空白屏幕的东西，除了一切都在那里，以网格形式，好像一切都很好，但它们都是不可见的。像这样：

这是我的代码 -- 谁能帮我理解这里发生了什么？

class AdminThings extends Component {

constructor(props) {
    super(props);
  }

  onGridReady( params ){

  }

  renderGrid(things) {
    return (
    <div className="ag-theme-fresh"> 
    <AgGridReact 
      id="myGrid"
      rowData={things}
      onGridReady={this.onGridReady.bind(this)}
    >
      {Things.schema._schemaKeys.map((row, index) => {
        return ( <AgGridColumn key={row} field={row}></AgGridColumn> );
      })}
    </AgGridReact>
    </div>
    );
  }  

  render() {
    return( !this.props.loading ? this.renderGrid(this.props.things) : <div></div>);
  }
};

AdminThings.propTypes = {
  loading: PropTypes.bool.isRequired,
  things: PropTypes.array
};

export default AdminThings = withTracker(({ match }) => {
  const subHandle = Meteor.subscribe( 'things' );
  const loading = !subHandle.ready();
  let things;
  if ( !loading ) {
    things = Things.find().fetch();
  }
  return {
    loading,
    things: things,
  };
})(AdminThings);

我不熟悉完全隐形，除非某些东西的不透明度为 0，而这里不是这种情况。谢谢！

Answer 1

从 ag-grid 的一个例子中得出。通过显式定义包含 AgGridReact 组件的 div 的高度和宽度，一切都奇迹般地出现了。因此，通过更改上面示例中的一行：

<div className="ag-theme-fresh">

对此：

<div style={{height: 400, width: 900, marginTop: 15}} className="ag-theme-fresh">

我得到了想要的结果：

ag-grid 存在，但在应用 css 时完全不可见

ag-grid is there but completely invisible when css is applied

meteor

ag-grid-react