Para treinar fiz a mudança do Topo de Class para Function com Hooks, renderizou certinho. O código ficou assim, vejam se faltou algo:
import React, { useEffect, useState } from "react"
import logo from "../../../assets/logo.png"
import { carregaTopo } from "../../../servicos/carregaDados"
import { Image, StyleSheet, Text, View } from "react-native"
export default function Topo() {
const [boasVindas, setBoasVindas] = useState("")
const [legenda, setLegenda] = useState("")
useEffect(() => {
const retorno = carregaTopo()
setBoasVindas(retorno.boasVindas)
setLegenda(retorno.legenda)
}, [])
return <View style={estilos.topo}>
<Image style={estilos.imagem} source={logo}/>
<Text style={estilos.boasVindas}>{boasVindas}</Text>
<Text style={estilos.legenda}>{legenda}</Text>
</View>
}
const estilos = StyleSheet.create({
topo: {
backgroundColor: "#f6f6f6",
padding: 16,
},
imagem: {
width: 70,
height: 28,
},
boasVindas: {
marginTop: 24,
fontSize: 26,
lineHeight: 42,
fontWeight: "bold",
color: "#464646"
},
legenda: {
fontSize: 16,
lineHeight: 26,
color: "#a3a3a3"
}
})