提问人:Nagabalan.k 提问时间:9/20/2023 最后编辑:marc_sNagabalan.k 更新时间:10/29/2023 访问量:27
如何编写 DataTable 的自定义样式
How to write the custom styles for DataTable
问:
如何在 react-data-table-component npm 中编写 DataTable 标题和分页箭头图标的样式,<DataTable columns={columns}
分页
data={conditionData?.existingPhysician?.slice().reverse()}
onChangePage={(e) =\\\> { setPage((e - 1) \\\* rowsPerPage); }}
onChangeRowsPerPage={(e) =\\\> { setRowsPerPage(e); }}
paginationRowsPerPageOptions={\\\[10, 15, 20, 25, 30\\\]} \\\>
import DataTable from 'react-data-table-component';
// This is my DataTable Component and columns is
const columns = [
{
name: '#',
selector: (row, index) => {
return index + 1 + page;
},
sortable: true,
width: window.innerWidth > 1600 ? '60px' : '6vw',
style: {
fontSize: '1vw',
padding: '1vw',
},
},
{
name: 'Physician Name',
selector: (row) => row.physicianName,
sortable: true,
width: window.innerWidth > 1600 ? '200px' : '20vw',
style: {
fontSize: '1vw',
padding: '1vw',
},
},
{
name: 'Consulting Since',
selector: (row) =>
row.created_at && moment(row.consultingSince).format('MMM Do YYYY '),
sortable: true,
width: window.innerWidth > 1600 ? '200px' : '20vw',
style: {
fontSize: '1vw',
padding: '1vw',
},
},
{
name: 'Consulting Until',
selector: (row) =>
row.endDate && moment(row.endDate).format('MMM Do YYYY '),
sortable: true,
width: window.innerWidth > 1600 ? '200px' : '20vw',
style: {
fontSize: '1vw',
padding: '1vw',
},
},
];
答: 暂无答案
评论