reactjs - antd med typescript: Tabell med Kolonne align='right' kompilerer ikke

Jeg bruker antd Table med Typescript som vist nedenfor

<Table dataSource={data} columns={columns2} />

Når jeg gir align: 'right' til en av kolonnene, kompilerer det ikke. Følgende feil vises. Jeg klarte ikke å finne årsaken til dette problemet. Enhver hjelp blir verdsatt.

Types of property 'align' are incompatible.
          Type 'string' is not assignable to type '"right" | "left" | "center" | undefined'.  TS2322

    47 |   public render() {
    48 |     return (
  > 49 |       <Table dataSource={data} columns={columns2} />
       |                                ^
    50 |     );
    51 |   }
    52 | }

Full kode er

import React from "react";
import { Table } from "antd";


const columns2 = [
  {
    title: 'Name',
    dataIndex: 'name',
    key: 'name',
  },
  {
    title: 'Age',
    dataIndex: 'age',
    key: 'age',
    align: 'right'
  },
  {
    title: 'Address',
    dataIndex: 'address',
    key: 'address',
  },
];

const data = [
  {
    key: '1',
    name: 'John Brown',
    age: 32,
    address: 'New York No. 1 Lake Park',
  },
  {
    key: '2',
    name: 'Jim Green',
    age: 42,
    address: 'London No. 1 Lake Park',
  },
  {
    key: '3',
    name: 'Joe Black',
    age: 32,
    address: 'Sidney No. 1 Lake Park',
  },
];


export class Sales extends React.Component<{}, {}> {
  public render() {
    return (
      <Table dataSource={data} columns={columns2} />
    );
  }
}

export default Sales;

Svar #1

import { AlignType } from 'rc-table/lib/interface';

align: 'right' as 'right',// not recommend
align: 'right' as const,// ok
align: 'right' as AlignType,// good

3 måter å løse problemet ditt på.

Svar #2

Dette fungerer for meg.

align: 'right' as const,

Så koden ser slik ut:

{
      title: 'Age',
      dataIndex: 'age',
      key: 'age',
      align: 'right' as const,
}

Relaterte artikler