卡体中的表单在NativeBase中不可见

Question

我尝试使用下面的代码（Form组件内部的Card）

<Card>
   <CardItem header style={{ backgroundColor: 'lightgray' }}>
   <Right>
      <Text>This is Right align text </Text>
   </Right>
   <Badge primary>
      <Text>step 1</Text>
   </Badge>
   </CardItem>
   <CardItem>
      <Body>
         <Text style={{color: 'red'}}>{this.state.error}</Text>
         <Form style={{alignSelf: 'stretch'}}>
         <Item>
            <Label>number:</Label>
            <Input keyboardType="numeric"/>
         </Item>
         <Item>
            <Label>date:</Label>
            <Input />
         </Item>
         <Item>
            <Label>number 2:</Label>
            <Input keyboardType="numeric"/>
         </Item>
         <Item>
            <Label>date 2:</Label>
            <Input />
         </Item>
         <Button success block
            >
            <Text>submit</Text>
            <Icon name='check' size={20} color="#FFFFFF"/>
         </Button>
         </Form>
      </Body>
   </CardItem>
</Card>

但是在我的设备上，带有android 5页脚的Nexus 7标签不可见。您是否有任何发现问题的建议并加以解决？我正在使用NativeBase 2.0.12和React-Native 0.42.0。

“screenshot_2017-03-22-12-00-35”

我认为可能与此问题有关：https://github.com/GeekyAnts/NativeBase/issues/668

尝试1：我稍稍更改了代码，然后为未出现的style={{backgroundColor: 'red'}}添加了CardItem，然后在外部卡组件上找到了它。这是我的新代码：

<Card>
   <CardItem header style={{ backgroundColor: 'lightgray' }}>
   <Right>
      <Text>This is Right align text </Text>
   </Right>
   <Badge primary>
      <Text>step 1</Text>
   </Badge>
   </CardItem>
   <CardItem style={{backgroundColor: 'red'}}>
   <Body>
      <Text style={{color: 'red'}}>{this.state.error}</Text>
      <Form style={{alignSelf: 'stretch'}}>
      <Item>
         <Label>number:</Label>
         <Input keyboardType="numeric"/>
      </Item>
      <Item>
         <Label>date:</Label>
         <Input />
      </Item>
      <Item>
         <Label>number 2:</Label>
         <Input keyboardType="numeric"/>
      </Item>
      <Item>
         <Label>date 2:</Label>
         <Input />
      </Item>
      <Button success block
         >
         <Text>submit</Text>
         <Icon name='check' size={20} color="#FFFFFF"/>
      </Button>
      </Form>
   </Body>
   </CardItem>
</Card>

这是新的屏幕截图： “screenshot_2017-03-22-18-27-22”

当我从Form中删除CardItem组件时，它成功呈现，如下所示：

<Card>
   <CardItem header style={{ backgroundColor: 'lightgray' }}>
   <Right>
      <Text>This is Right align text </Text>
   </Right>
   <Badge primary>
      <Text>step 1</Text>
   </Badge>
   </CardItem>
   <CardItem style={{backgroundColor: 'red'}}>
   <Body>
      <Text style={{color: 'red'}}>{this.state.error}</Text>
   </Body>
   </CardItem>
</Card>

“screenshot_2017-03-22-18-32-42”

为什么我们不能在Form中使用CardItem？它是Card组件的未记录限制吗？

卡体中的表单在NativeBase中不可见

问题描述投票：13回答：1

1个回答

最新问题

卡体中的表单在NativeBase中不可见

问题描述 投票：13回答：1

1个回答

最新问题

问题描述投票：13回答：1