how to set colspan from createColumnHelper.

Just started with tanstack table, so far I'm really liking it. But I want to set a colspan of 4 or 5 on the first column of my table. I'm not able to find out how to do this just yet, so wanted to ask. I've tried using "size" in the column, but it doesn't seem to affect colspan, and typescript complains if I try to pass in an arg of colspan

const columns = [
  columnHelper.accessor('title', {
    id: 'title',
    size: 4,
    header: 'Title',
    cell: (info) => (
     <Text as="u" noOfLines={1} whiteSpace="wrap">
       {info.getValue()}
     ...
 
const table = useReactTable...

<Thead>
  {table.getHeaderGroups().map((headerGroup) => (
    <Tr key={headerGroup.id}>
      {headerGroup.headers.map((header) => (
        <Th key={header.id} colSpan={header.colSpan}
....

const columns = [
  columnHelper.accessor('title', {
    id: 'title',
    size: 4,
    header: 'Title',
    cell: (info) => (
     <Text as="u" noOfLines={1} whiteSpace="wrap">
       {info.getValue()}
     ...
 
const table = useReactTable...

<Thead>
  {table.getHeaderGroups().map((headerGroup) => (
    <Tr key={headerGroup.id}>
      {headerGroup.headers.map((header) => (
        <Th key={header.id} colSpan={header.colSpan}
....

TanStack•2y ago•

1 reply

wet-aqua

how to set colspan from createColumnHelper.

const columns = [
  columnHelper.accessor('title', {
    id: 'title',
    size: 4,
    header: 'Title',
    cell: (info) => (
     <Text as="u" noOfLines={1} whiteSpace="wrap">
       {info.getValue()}
     ...
 
const table = useReactTable...

<Thead>
  {table.getHeaderGroups().map((headerGroup) => (
    <Tr key={headerGroup.id}>
      {headerGroup.headers.map((header) => (
        <Th key={header.id} colSpan={header.colSpan}
....

const columns = [
  columnHelper.accessor('title', {
    id: 'title',
    size: 4,
    header: 'Title',
    cell: (info) => (
     <Text as="u" noOfLines={1} whiteSpace="wrap">
       {info.getValue()}
     ...
 
const table = useReactTable...

<Thead>
  {table.getHeaderGroups().map((headerGroup) => (
    <Tr key={headerGroup.id}>
      {headerGroup.headers.map((header) => (
        <Th key={header.id} colSpan={header.colSpan}
....

how to set colspan from createColumnHelper.

Similar Threads

how to set colspan from createColumnHelper.

Similar Threads

Similar Threads

Similar Threads