javascriptreactjscomponents

What is the difference between the following React components?

What is the difference between the following methods of defining a react component?

Is the second method simply a shorter way of writing the same code? Will they both run and render exactly the same thing?

import React from 'react'

function MyApp() {
    return (
        <h1>
            Hello, World!
        </h1>
    )
}

export default MyApp

import React from 'react'

export default function MyApp() {
    return (
        <h1>
            Hello, World!
        </h1>
    )
}
Solution

  • I guess your question is more about the position of the export default statement. If this is the case, well in general if MyApp is the only thing you want to export then yes, these two methods will behave the same.