使用数组来调用React函数的方法

Question

我正在将一个数组的数组传递给名为CreditFilter的函数，如下所示：

const rowData = [
  ['Capri LLC', '0012345', 'A0012', 'Y', 'View Details'],
  ['Capricorn INC', '0022345', 'B0012', 'N', 'View Details'],
  ['Cancer INC', '0033345', 'A0012', 'Y', 'View Details'],
];

const CompanySelection: FunctionComponent<RNDTaxCreditCompanySelectionProps> = props => {
  return (
    <>
      <Form<FormProps> initialValues={{ companyId: null }} onSubmit={() => {}}>
        {formProps => {
          return (
            <Card w={12 / 12} border={false}>
              <Card.Header p={0} px={0}>
                <Heading level={2} pt={1}>
                  R&D Tax Administration
                </Heading>
                <Heading level={5} pt={1}>
                  Please select a filing year and search for a company by ID or FEIN number.
                </Heading>
              </Card.Header>
              <CreditFilter status="" rowData={rowData} />
            </Card>
          );
        }}
      </Form>
    </>
  );
};

请告诉我如何在CreditFilter函数内部访问该数组的数组？ 可以使用props访问吗？还是其他方式？

interface Props {
  status: string;
}
export const CreditFilter: FunctionComponent<Props> = props => {
    // 如何在这里访问rowData变量？
}

Answer 1

export const CreditFilter: FunctionComponent<Props> = (props: Props) => {
  
  const rowData = props.rowData; // 你可以通过props.rowData访问rowData的值
  const status = props.status; // 同样也可以通过props.status访问status的值

  // ... 现在你可以在组件逻辑中使用'rowData'和'status'
 
};

然而根据你的示例，Props接口应该是这样的：

interface Props {
  status: string;
  rowData: string[][];
}

因为rowData也作为props传递给组件，不仅仅是status