时间戳

首页 > 解决方案 > 如何自动调整primereact Datatable中的列

css - 如何自动调整primereact Datatable中的列

问题描述

我正在使用主要的反应数据表来填充日期。我想使用表中的列自动调整值。我曾尝试使用一些 css 和 dattable 属性，但它不适合我。这是我到目前为止所做的

const MyBookDatable = ({ data, onPageChange, exportFile }) => {
const { totalElements, content, pageable } = data;
const [pageSize, setpageSize] = useState(0);

const dynamicColumns = columns.map((column) => {
return (
  <Column
    //headerStyle={{ width: "100%" }}
    //bodyClassName="tableBody"
    className = {column.field + " tableBody"}
    field={column.field}
    header={column.header}
  ></Column>
   );
 });

在这里我创建了列

export const columns = [
{
  "field": "market",
  "header": "Market"
},
{
  "field": "storeNumber",
  "header": "Store Number"
},
{

这是数据表css

.datatableStyle {
width: auto;

overflow-x: scroll;
max-height: 80vh;
min-height: 40vh;
}

这些列不会自动调整值，而且我想将水平滚动条添加到表格中。任何人都可以帮助我。我是新手反应。

标签： cssdatatableprimereact

解决方案

在旧版本的数据表中，它作为一个名为 responsive 的属性，并在数据表中将其设置为responsive={true}true

推荐阅读