JSX внутри Аккордеонного контента в Native Base (React Native) - PullRequest
0 голосов
/ 26 марта 2020

Возможно ли иметь код JSX внутри содержимого Accordion в нативной базе?

class MyAccount extends React.Component {
    render() {

      const creditCardContent = (
          <Form>
            <Item floatingLabel>
              <Label>Name on Card</Label>
              <Input />
            </Item>
            <Item floatingLabel>
              <Label>Card Number</Label>
              <Input />
            </Item>
            <Item floatingLabel>
              <Label>CVC</Label>
              <Input />
            </Item>
            <Item floatingLabel>
              <Label>Zip Code</Label>
              <Input />
            </Item>
          </Form>
      );
      const dataMenus = [
        { title: "Credit Card", content: creditCardContent },
        { title: "Bank Account (for ACH payments)", content: "Lorem ipsum dolor sit amet" },
        { title: "Recurring Payment", content: "Lorem ipsum dolor sit amet" }
      ];

      return (
        <Container>
          <Content padder>
            <ScrollView>
              <Accordion dataArray={dataMenus} expanded={0}/>
            </ScrollView>
          </Content>
        </Container>
      );
    }
}

В результате не отображается содержимое кредитной карты (изображение ниже) enter image description here

Я не уверен, что делаю что-то не так или это невозможно сделать. Спасибо

1 Ответ

1 голос
/ 27 марта 2020

Насколько я помню, вы можете сделать это с помощью свойства renderContent, где вы можете определить, как оно должно отображаться. Вы можете передать его как константу или как renderContent = (item) => { ... }.

Но то, что вы сейчас делаете, - это предоставление dataArray с React.Element, а затем набором строк, которые он не может отобразить.

...