Fixed #1734 - New rowStyle prop for DataTable
parent
5dba71a254
commit
cedb06ca0a
|
@ -299,6 +299,12 @@ const DataTableProps = [
|
|||
default: "null",
|
||||
description: "A function that takes the row data and returns a string to apply a particular class for the row."
|
||||
},
|
||||
{
|
||||
name: "rowStyle",
|
||||
type: "object",
|
||||
default: "null",
|
||||
description: "Inline style of the row."
|
||||
},
|
||||
{
|
||||
name: "scrollable",
|
||||
type: "boolean",
|
||||
|
|
|
@ -25,7 +25,7 @@
|
|||
@column-dragstart="onColumnHeaderDragStart($event)" @column-dragover="onColumnHeaderDragOver($event)" @column-dragleave="onColumnHeaderDragLeave($event)" @column-drop="onColumnHeaderDrop($event)"
|
||||
@column-resizestart="onColumnResizeStart($event)" @checkbox-change="toggleRowsWithCheckbox($event)" />
|
||||
<DTTableBody v-if="frozenValue" :value="frozenValue" :frozenRow="true" class="p-datatable-frozen-tbody" :columns="columns" :dataKey="dataKey" :selection="selection" :selectionKeys="d_selectionKeys" :selectionMode="selectionMode" :contextMenu="contextMenu" :contextMenuSelection="contextMenuSelection"
|
||||
:rowGroupMode="rowGroupMode" :groupRowsBy="groupRowsBy" :expandableRowGroups="expandableRowGroups" :rowClass="rowClass" :editMode="editMode" :compareSelectionBy="compareSelectionBy" :scrollable="scrollable"
|
||||
:rowGroupMode="rowGroupMode" :groupRowsBy="groupRowsBy" :expandableRowGroups="expandableRowGroups" :rowClass="rowClass" :rowStyle="rowStyle" :editMode="editMode" :compareSelectionBy="compareSelectionBy" :scrollable="scrollable"
|
||||
:expandedRowIcon="expandedRowIcon" :collapsedRowIcon="collapsedRowIcon" :expandedRows="expandedRows" :expandedRowKeys="d_expandedRowKeys" :expandedRowGroups="expandedRowGroups"
|
||||
:editingRows="editingRows" :editingRowKeys="d_editingRowKeys" :templates="$slots" :loading="loading" :responsiveLayout="responsiveLayout"
|
||||
@rowgroup-toggle="toggleRowGroup" @row-click="onRowClick($event)" @row-dblclick="onRowDblClick($event)" @row-rightclick="onRowRightClick($event)" @row-touchend="onRowTouchEnd" @row-keydown="onRowKeyDown"
|
||||
|
@ -35,7 +35,7 @@
|
|||
@row-edit-init="onRowEditInit($event)" @row-edit-save="onRowEditSave($event)" @row-edit-cancel="onRowEditCancel($event)"
|
||||
:editingMeta="d_editingMeta" @editing-meta-change="onEditingMetaChange" />
|
||||
<DTTableBody :value="dataToRender" :columns="columns" :empty="empty" :dataKey="dataKey" :selection="selection" :selectionKeys="d_selectionKeys" :selectionMode="selectionMode" :contextMenu="contextMenu" :contextMenuSelection="contextMenuSelection"
|
||||
:rowGroupMode="rowGroupMode" :groupRowsBy="groupRowsBy" :expandableRowGroups="expandableRowGroups" :rowClass="rowClass" :editMode="editMode" :compareSelectionBy="compareSelectionBy" :scrollable="scrollable"
|
||||
:rowGroupMode="rowGroupMode" :groupRowsBy="groupRowsBy" :expandableRowGroups="expandableRowGroups" :rowClass="rowClass" :rowStyle="rowStyle" :editMode="editMode" :compareSelectionBy="compareSelectionBy" :scrollable="scrollable"
|
||||
:expandedRowIcon="expandedRowIcon" :collapsedRowIcon="collapsedRowIcon" :expandedRows="expandedRows" :expandedRowKeys="d_expandedRowKeys" :expandedRowGroups="expandedRowGroups"
|
||||
:editingRows="editingRows" :editingRowKeys="d_editingRowKeys" :templates="$slots" :loading="loading" :responsiveLayout="responsiveLayout"
|
||||
@rowgroup-toggle="toggleRowGroup" @row-click="onRowClick($event)" @row-dblclick="onRowDblClick($event)" @row-rightclick="onRowRightClick($event)" @row-touchend="onRowTouchEnd" @row-keydown="onRowKeyDown"
|
||||
|
@ -285,6 +285,10 @@ export default {
|
|||
type: null,
|
||||
default: null
|
||||
},
|
||||
rowStyle: {
|
||||
type: null,
|
||||
default: null
|
||||
},
|
||||
scrollable: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
|
|
|
@ -10,7 +10,7 @@
|
|||
<component :is="templates['groupheader']" :data="rowData" :index="index" />
|
||||
</td>
|
||||
</tr>
|
||||
<tr :class="getRowClass(rowData)" :key="getRowKey(rowData, index)"
|
||||
<tr :class="getRowClass(rowData)" :style="rowStyle" :key="getRowKey(rowData, index)"
|
||||
v-if="expandableRowGroups ? isRowGroupExpanded(rowData): true"
|
||||
@click="onRowClick($event, rowData, index)" @dblclick="onRowDblClick($event, rowData, index)" @contextmenu="onRowRightClick($event, rowData, index)" @touchend="onRowTouchEnd($event)" @keydown="onRowKeyDown($event, rowData, index)" :tabindex="selectionMode || contextMenu ? '0' : null"
|
||||
@mousedown="onRowMouseDown($event)" @dragstart="onRowDragStart($event, index)" @dragover="onRowDragOver($event,index)" @dragleave="onRowDragLeave($event)" @dragend="onRowDragEnd($event)" @drop="onRowDrop($event)" role="row">
|
||||
|
@ -131,6 +131,10 @@ export default {
|
|||
type: null,
|
||||
default: null
|
||||
},
|
||||
rowStyle: {
|
||||
type: null,
|
||||
default: null
|
||||
},
|
||||
editMode: {
|
||||
type: String,
|
||||
default: null
|
||||
|
|
|
@ -2108,6 +2108,12 @@ export default {
|
|||
<td>null</td>
|
||||
<td>A function that takes the row data and returns a string to apply a particular class for the row.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>rowStyle</td>
|
||||
<td>object</td>
|
||||
<td>null</td>
|
||||
<td>Inline style of the row.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>scrollable</td>
|
||||
<td>boolean</td>
|
||||
|
|
Loading…
Reference in New Issue