Question

我正在使用bootstrap表。
我的桌很长（很多行）。
我试图让我的表头修复（当我滚动时我仍然会看到头表）。
有没有一种简单的方法可以在bootstrap表中实现它？
我的桌子：

 <BootstrapTable tableBodyClass="table borderless" data={rows} hover={true} options={this.state.options} trClassName={trClassFormat} search={true}>
    <TableHeaderColumn row='0' rowSpan='2' dataSort={true} width="40px" isKey={true} dataField="id" hidden>ID</TableHeaderColumn>
    <TableHeaderColumn row='0' rowSpan='2' dataField="name" width="110px" dataSort={true}>Name</TableHeaderColumn>
    <TableHeaderColumn row='0' rowSpan='2' dataField="lastName" width="30px" editable={false} dataSort={true} sortFunc={this.sortLastPrice}>Last Name</TableHeaderColumn>
    <TableHeaderColumn row='0' colSpan='3'>A</TableHeaderColumn>
    <TableHeaderColumn row='1' dataField="a1" width="20px" editable={false} dataSort={true} sortFunc={this.sortA1} columnClassName={columnClassNameFormat}>A1</TableHeaderColumn>
    <TableHeaderColumn row='1' dataField="a2" width="25px" editable={false} dataSort={true} sortFunc={this.sortA2} columnClassName={columnClassNameFormat}>A2</TableHeaderColumn>
    <TableHeaderColumn row='1' dataField="a3" width="30px" editable={false} dataSort={true} sortFunc={this.sortA3} columnClassName={columnClassNameFormat}>A3</TableHeaderColumn>
    <TableHeaderColumn row='0' colSpan='1'>B</TableHeaderColumn>
    <TableHeaderColumn row='1' dataField="b1" width="20px" editable={false} dataSort={true} sortFunc={this.sortB1} columnClassName={columnClassNameFormat}>B1</TableHeaderColumn>
    <TableHeaderColumn row='0' colSpan='3'>C</TableHeaderColumn>
    <TableHeaderColumn row='1' dataField="c1" width="20px" dataSort={true} sortFunc={this.sortC1}>C1</TableHeaderColumn>
    <TableHeaderColumn row='1' dataField="c2" width="25px" dataSort={true} sortFunc={this.sortC2}>C2</TableHeaderColumn>
    <TableHeaderColumn row='1' dataField="c3" width="30px" dataSort={true} sortFunc={this.sortC3}>C3</TableHeaderColumn>
  </BootstrapTable>

Answer 1

是的，设置固定CSS可能只是一种选择。我知道链接只有答案不好但如果您想使用外部库来修复它，这将100％帮助您。我正在使用sticky.js。要使用Ez，请在此处下载：http://stickyjs.com/

PS：这不是我的。不要把它作为广告，我只是认为图书馆非常好并且易于使用。

我在引导表

1 个答案: