反应原生flexDirection错误？

我只是瞪着天生的反应和周围的戏剧。所以我刚刚尝试了flexDirection风格。反应原生flexDirection错误？

因此我从facebook-react中拷贝了这个例子，它看起来不错。

代码我testet并在我的iPhone（世博APP）相同的外观和webside在世博园应用

enter code here 
    <View style={{ 
    flex: 1, 
    flexDirection: 'row', 
    justifyContent: 'flex-end', 
    }}> 
    <View style={{width: 50, height: 50, backgroundColor: 'powderblue'}} /> 
    <View style={{width: 50, height: 50, backgroundColor: 'skyblue'}} /> 
    <View style={{width: 50, height: 50, backgroundColor: 'steelblue'}} /> 
    </View>

为flexDirection: 'row'。但是，如果我有机会到column我的屏幕只是白色（视图元素消失？）。我tryed接下来的事情是设置justifyContent: 'center'我这样做是它看起来像图片我追加，超级wird，如果你在Facebook页面应该OBV居中测试后...

那么这是一个错误？那里有什么错误？

这是孔的东西...：

export default class App extends React.Component { 
 
    render() { 
 
    return (
 
     <NativeRouter> 
 
     <View> 
 
      <Route exact path='/'> 
 
       <View style={{ 
 
        flex: 1, 
 
        flexDirection: 'column', 
 
        justifyContent: 'center' 
 
       }}> 
 
        <View style={{width: 50, height: 50, backgroundColor: 'powderblue'}} /> 
 
        <View style={{width: 50, height: 50, backgroundColor: 'skyblue'}} /> 
 
        <View style={{width: 50, height: 50, backgroundColor: 'steelblue'}} /> 
 
       </View> 
 
      </Route> 
 
     </View> 
 
     </NativeRouter> 
 
    ); 
 
    } 
 
}

来源

2017-10-16 Zero Soul Eater

我认为，如果你删除第一个视图标签，它会正常工作。我在React本地网站上测试过。发生这种情况是因为您的第一个视图不适合您的所有屏幕。您可以重新调整第一个视图标记，或者为其设置柔性。

您也可以检查路线。

export default class App extends React.Component { 
 
    render() { 
 
    return (
 
     <NativeRouter> 
 
     <View style={{ 
 
      flex: 1 
 
     }}> 
 
      <Route exact path='/'> 
 
       <View style={{ 
 
        flex: 1, 
 
        flexDirection: 'column', 
 
        justifyContent: 'center' 
 
       }}> 
 
        <View style={{width: 50, height: 50, backgroundColor: 'powderblue'}} /> 
 
        <View style={{width: 50, height: 50, backgroundColor: 'skyblue'}} /> 
 
        <View style={{width: 50, height: 50, backgroundColor: 'steelblue'}} /> 
 
       </View> 
 
      </Route> 
 
     </View> 
 
     </NativeRouter> 
 
    ); 
 
    } 
 
}

来源

2017-10-16 10:18:31

林新的反应原生，所以谢谢你非常糊状为你帮助:) –

我通常有这样的问题，你可能要在父视图中添加flex:1所以它会充满了画面，然后弯曲，方向应该是正确的。

来源

2017-10-16 20:07:52

反应原生flexDirection错误？

回答

相关问题