Question 230898 in Reactjs Question posted in
The new location for the React Documentation can be found here.

Reactjs – How to call React function with an array of array?

I am passing an array of arrays to one function called CreditFilter as shown below,

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>
    </>
  );
};

Please let me know how to access that array or arrays inside CreditFilter function?
Is that accessible using props? Or any other way?

interface Props {
  status: string;
}
export const CreditFilter: FunctionComponent<Props> = props => {
    // How to access rowData variable here?
}
Tags:

2

Answers


  1. 0 
    export const CreditFilter: FunctionComponent<Props> = (props: Props) => {
  
  const rowData = props.rowData; // you can access the rowData value with props.rowData
  const status = props.status; // same for status value

  // ... now you can use 'rowData' and 'status' in your component logic
 
};

    However according to your example this is how the Props interface should look like:

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

    because rowData is also passed as props to the component not only status

    Login or Signup to reply.
  2. 0

    In your CompanySelection component you are passing rowData to CreditFilter through props

      <CreditFilter status="" rowData={rowData} />

    Which mean that you can add rowData field to your CreditFilter Props interface

    interface Props {
  status: string;
  rowData: string[][];
}
export const CreditFilter: FunctionComponent<Props> = props => {
   props.rowData; // you can access rowData from props
}
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search