我使用以下代码:
import React from 'react';
import { Text, View } from 'react-native';
export default class App extends React.Component {
render() {
return (
<View style={{paddingTop:30,flexDirection:'row',}}>
<View style={{backgroundColor:'red',width:50,height:50}}><Text>1</Text></View>
<View style={{backgroundColor:'green',width:50,height:50}}><Text>2</Text></View>
</View>
);
}
}
结果是:
我认为正确的结果是:
为什么显示错了?
答案 0 :(得分:0)
使用flex
代替这样的高度和宽度:
import React from 'react';
import { Text, View } from 'react-native';
export default class App extends React.Component {
render() {
return (
<View style={{paddingTop:30,flexDirection:'row',}}>
<View style={{backgroundColor:'red',flex:.5}}><Text>1</Text></View>
<View style={{backgroundColor:'green',flex:.5}><Text>2</Text></View>
</View>
);
}
}
您可以根据自己的需要设置弹性。这只是一个例子...
答案 1 :(得分:0)
我发现了问题,这是因为Genymotion中设置了位置,我在App.js中使用下面的代码来解决问题
import {I18nManager} from 'react-native'
I18nManager.forceRTL(false)