Javascript 子视图边框覆盖父视图'；一对一

我在父

视图

组件中有子

视图

。我设置了父视图的边框，但子视图的边框覆盖了父视图的边框

这是屏幕

这是我的密码

<View style={{flexDirection: 'row',marginLeft: 20, marginRight: 20, height: height/20,
                    width: width-40, borderWidth: 2, borderRadius: 4, borderColor: '#D3D3D3'}}>
                    <View style={{backgroundColor: '#D3D3D3',flexDirection: 'row',
                        height: height/20, alignItems: 'center'}}>
                      <Thumbnail style={{marginLeft: 5,width: 20, height: 20}} square source={require('../assets/Turkey.png')}/>
                      <Picker mode="dropdown" selectedValue={this.state.selectedCountry}
                              onValueChange={(value)=>this.onCodeChanged(value)}
                              >
                          <Picker.Item label="+44" value="England"></Picker.Item>
                          <Picker.Item label="+90" value="Turkey"></Picker.Item>
                      </Picker>
                    </View>
                    <View style={{height: height/20, width: 250}}>
                        <Input placeholder="Phone" placeholderTextColor='#D3D3D3'/>
                    </View>
                </View>

this.onCodeChanged（值）}
>

---

我试图将子视图的

borderBottomWidth

props设置为0，但没有成功。有人知道如何解决这个问题吗？

不是边界。您正在输入所有内容的高度（高度/20），但没有考虑刚才添加的边界，该边界将计入高度

试试（身高/20-4）