Variable: FlexRender

const FlexRender: DefineComponent<{
  cell?: any;
  footer?: any;
  header?: any;
  props?: any;
  render?: any;
}, () => any, {
}, {
}, {
}, ComponentOptionsMixin, ComponentOptionsMixin, {
}, string, PublicProps, ToResolvedProps<{
  cell?: any;
  footer?: any;
  header?: any;
  props?: any;
  render?: any;
}, {
}>, {
  cell: any;
  footer: any;
  header: any;
  props: any;
  render: any;
}, {
}, {
}, {
}, string, ComponentProvideOptions, true, {
}, any>;

const FlexRender: DefineComponent<{
  cell?: any;
  footer?: any;
  header?: any;
  props?: any;
  render?: any;
}, () => any, {
}, {
}, {
}, ComponentOptionsMixin, ComponentOptionsMixin, {
}, string, PublicProps, ToResolvedProps<{
  cell?: any;
  footer?: any;
  header?: any;
  props?: any;
  render?: any;
}, {
}>, {
  cell: any;
  footer: any;
  header: any;
  props: any;
  render: any;
}, {
}, {
}, {
}, string, ComponentProvideOptions, true, {
}, any>;

Defined in: packages/vue-table/src/FlexRender.ts:52

Simplified component for rendering headers, cells, or footers.

Supports both the new shorthand pattern and the legacy :render/:props pattern:

Example

vue

<!-- New shorthand pattern -->
<FlexRender :cell="cell" />
<FlexRender :header="header" />
<FlexRender :footer="header" />

<!-- Legacy pattern (still supported) -->
<FlexRender :render="cell.column.columnDef.cell" :props="cell.getContext()" />

<!-- New shorthand pattern -->
<FlexRender :cell="cell" />
<FlexRender :header="header" />
<FlexRender :footer="header" />

<!-- Legacy pattern (still supported) -->
<FlexRender :render="cell.column.columnDef.cell" :props="cell.getContext()" />

FlexRender

Variable: FlexRender#

Example#

Variable: FlexRender

Example