- antd中表格组件的表头和表格体对齐
- react新手入门教程03-纯前端渲染table+弹窗
- 2017.9.4
- table
- HTMl-表格
- element-ui的table表格控件表头与内容列不对齐问题
- 表格以及流程图的制作
- html5表格标签
- Markdown表格语法
- Antd中的Table数据异步动态加载性能优化
antd的表格组件中,如果表格内内容比较多,容易出现表头和表格体不对齐的问题,解决方法很简单,需要直接把表格头固定宽,这样下面表格体会自动对齐。
图片效果是教学视频截取的,感兴趣的可以自己动手试一试就明白了。表头和行对齐
表格头的宽度直接设置在数据源中即可。
export default class TableList extends React.Component { constructor(props) { super(props) this.state = { // box: true, } } render() { // 表格数据源 const columns = [ { title: '币种', dataIndex: 'name', key: 'name', width:150,// 这是表格头的宽度,用来对齐表格头和表格体 } ] return( <div> <Table columns={columns} /> </div> ) } }
网友评论