react-nativefunctioncomponents

ways of exporting the default function app with code inside in react native


I am new to react native and I have a question regarding the export of functions, specifically the exporting of the default app.

I have seen two ways of exporting it, the first being:

export default function App() {
  return (/*Code goes in here and it renders*/);
}

Which automatically renders whatever code there is inside, and the other one is by creating a class component, like this

class App extends Component {
 /*functions like componentDidMount() can go in here/*

 render() { /*now the rendering code goes in here}
}

export default App;

What's the difference between this two forms of exporting the default app? Is it that the first one can only return basic code while in the second one a person can define the state and create functions like componentDidMount()? Or you can do the same in both, but it's just a way of declaring things?

Thanks for your time and your consideration in explaining this matter.


Solution

  • You are defining different kind of components.

    The first one is a functional component, defined with a function.

    The second one is a class component, defined with a class.

    For more information about the differences between them you can check https://www.geeksforgeeks.org/differences-between-functional-components-and-class-components-in-react/ or google it.