如何使用<autosizer>将宽度和高度设置为100%?

时间:2017-09-05 11:46:14

标签: css reactjs react-virtualized

我按照示例结果:demosource code

他们设置宽度= {宽度}和高度= {高度},如果我这样做我什么也没有显示...要显示我需要设置高度的东西,为exaple 600px,但我希望有这个到窗户高度的100%。

我该怎么做?

CSS

.AutoSizerWrapper {
  flex: 1 1 auto;
}

这是我的代码。

  <div className="AutoSizerWrapper">
    <AutoSizer>
      {({ width, height }) => (
        <Table
          width={width}
          height={600}
          headerHeight={50}
          rowHeight={50}
          rowCount={this.props.list.length}
          rowGetter={({ index }) => this.props.list[index]}
        >
          <Column label="#" dataKey="_id" width={100} flexGrow={1} />
          <Column
            label="Part Number"
            dataKey="itemNumber"
            disableSort
            width={100}
            flexGrow={1}
          />
          <Column
            width={100}
            label="Part Name"
            dataKey="partName"
            disableSort
            flexGrow={1}
          />
          <Column
            width={100}
            label="Part Description"
            dataKey="partDescription"
            disableSort
            flexGrow={1}
          />
          <Column
            width={100}
            label="customs Tariff Number"
            dataKey="customsTariff"
            disableSort
            flexGrow={1}
          />
          <Column
            width={100}
            label="Net Weight (kg)"
            dataKey="netWeight"
            disableSort
            flexGrow={1}
          />
        </Table>
      )}
    </AutoSizer>
</div>

0 个答案:

没有答案