I have a problem with react-native
elements. I have one <Parent>
component that is a View
and I have one <Child>
component as a child that is also a View
. I would like that <Child>
will always be 100% width and height of <Parent>
. I know I can pass width: '100%'
and height: '100%'
but is it a good way of styling it? What is the best practice to setup parent and child and parent will define width and height and child will always be depending on the parent component?
CodePudding user response:
for this , you can use flex
for style like this :
import React from "react";
import { StyleSheet, Text, View } from "react-native";
const Flex = () => {
return (
<View style={[styles.container, {
// Try setting `flexDirection` to `"row"`.
flexDirection: "column"
}]}>
<View style={{ flex: 1, backgroundColor: "red" }} />
</View>
);
};
const styles = StyleSheet.create({
container: {
flex: 1,
},
});
export default Flex;
for more info see this