为什么任何创建的颜色框都没有出现在模拟器中

Question

本机。正如我所说，我的问题是，我的盒子是由这个代码创建的，没有出现在模拟器上

我做了基本的编码来创建样式和渲染。

type Props = {};
export default class App extends Component<Props> {
render() {
return (
<View style={styles.container}>
<View styles={styles.style1}></View>
<View styles={styles.style2}></View>
</View>
);
}
}
const styles = StyleSheet.create({
container:{
backgroundColor: '#FFEB3B',
flex: 1
},
style1:{
backgroundColor: '#FF5722',
},
style2:{
backgroundColor: '#607D8B',
flex:1
}
});

没有显示错误消息。

Answer 1

只有当视图中有一些内容时，视图才会呈现，因为视图中没有添加任何内容。所以它不需要任何高度或宽度。所以在你的情况下，你必须为两个视图提供一些高度和宽度。

style1:{
backgroundColor: '#FF5722',
height: 200,
width: 200,
},
style2:{
backgroundColor: '#607D8B',
height: 200,
width: 200,
}