styled.View does not see props

This is literally one of my first components on react (and react-native too), so don’t swear if the error is elementary.

I want to make a flex component and I pass the child components and the direction="column" parameter into it, but I still have the flex-direction: row

What is wrong?

file 'flex.js':

const StyledFlex = styled.View`
  display: flex;
  flex-direction: ${props => props.direction || "row"};

 const Flex = (props) => {
   return <StyledFlex> {props.children}</StyledFlex>


export default function App() {
  return (
      <StatusBar />
        <Flex direction="column">
          <ButtonStatistic />
          <ButtonAdd />


enter image description here

As you can see, buttons are in row

>Solution :

You don’t pass the props to StyledFlex.

const Flex = (props) => {
  return <StyledFlex {...props}> 

Leave a Reply