2

I'm currently in the process of upgrading a project from React 17 to React 18 and I'm running into an issue where previously, I was able to render strings as Cells for my column definitions. E.g.

{
    Header: t("common.from").toString(),
    accessor: (rentalOrder) => WDate.toSortString(rentalOrder.from),
    Cell: ({ row }: CellProps<SearchResultRentalOrder>) => WDate.toShortString(row.original.from)
}

This is for react-table 7 by the way. In React 17 this was allowed, yet in React 18 I'm getting an error:

 Type 'string' is not assignable to type 'ReactElement<any, any>'

When I look at the typings for Cell, I see the following definition:

export type Renderer<Props> = ComponentType<Props> | ReactElement | ReactText | ReactFragment;

Where ReactText has the following definition:

type ReactText = string | number;

So I'd expect that a string is still allowed. I know I can wrap my cell in an empty fragment or a span, but feels like the wrong solution. Are there any other options?

nbokmans
  • 5,492
  • 4
  • 35
  • 59

0 Answers0