2種類のコードが反応ネイティブで異なる動作をしているのはなぜですか？

Question

私はこの2種類のコードを書いていますが、最初のものは正しいレンダリングで表示されますが、2番目のものは正しくない空のコンテンツレンダリングとして表示されます。どのような行動を説明することができますか？あなたは関数としてcontentを定義している第2のケースで

まず

import React from 'react' 
import { Text } from 'react-native' 

const Header =() => { 
    return <Text style={style.header}>{content}</Text>; 
} 

const style = { 
header: { 
    fontSize: 20 
} 
} 

const content = "content" 

export { Header }; 

セカンド

import React from 'react' 
import { Text } from 'react-native' 

const Header =() => { 
    return <Text style={style.header}>{content}</Text>; 
} 

const style = { 
header: { 
    fontSize: 20 
} 
} 

const content =() => { 
    return "content" 
} 

export { Header }; 

Answer 1

。