TxColumn · Vue · tecexpress

DataGrid column configuration; it has no standalone UI.

Prop	Type	Default	Meaning
`dataField`	`string`	`required`	Field name; must be unique within a grid.
`caption`	`string \| undefined`	`undefined`	Visible field/column caption.
`width`	`string \| number \| undefined`	`undefined`	Width; Vue numbers use pixels, Flutter uses logical pixels.
`allowSorting`	`boolean \| undefined`	`true`	Allows sorting this column.
`allowFiltering`	`boolean \| undefined`	`true`	Allows filtering this column.
`cellTemplate`	`string \| undefined`	`undefined`	Vue slot name for custom cells.
`visible`	`boolean \| undefined`	`true`	Controls visibility.
`alignment`	`"center" \| "left" \| "right" \| undefined`	`undefined`	Content alignment.

vue

<script setup lang="ts">
import { TxColumn, TxDataGrid } from '@tekocloud.de/tecexpress'
import '@tekocloud.de/tecexpress/themes/index.css'
const rows = [{ id: 1, name: 'Alex' }]
</script>

<template>
  <TxDataGrid :data-source="rows" key-expr="id">
    <TxColumn data-field="name" caption="Name" cell-template="nameCell" />
    <template #nameCell="{ value }"><strong>{{ value }}</strong></template>
  </TxDataGrid>
</template>

TxColumn.