-1
I’m banging head with Ionic-React has a while already, and I can’t understand why the code below does not generate the text on the screen.
const AgendaDiaria: React.FC = () => {
const {user} = useSloopContext();
const [module, set_module] = useState<iDynamic>({});
const [kid, set_kid] = useState<iDynamic>({});
const [color, set_color] = useState('');
const [pages, set_pages] = useState([]);
// Primeira renderização
useEffect(() => {
const modules:iDynamic = user.kid.school.modules; //Carrega os módulos
set_module(modules.agendaDiaria); //define o modulo da agenda
set_color(module.color ? module.color : 'var(--ion-color-primary)'); // define a cor
set_kid(user.kid); // define a criança selecionada
}, []);
//renderiza depois de atualizar a criança
useEffect(() => {
loadPages(); // carrega as páginas
}, [kid]);
//renderiza depois de atualizar as páginas
useEffect(() => {
}, [pages]);
const loadPages = async () => {
//busca no banco de dados as páginas
const dbName = 'sloop_kid_' + kid.id;
const store = await getDB(dbName, 'agendaDiaria');
let pgs = [];
store.forEach((value, key, index) => {
pgs.push(value);
});
//define as páginas
set_pages(pgs);
};
//renderiza as páginas
const renderedPages = pages.map((page, index) => {
console.log(page.dtFormated);
return (
<IonLabel key={index}>{page.dtFormated}</IonLabel>
);
});
const updatePage = () => {
};
return (
<IonPage>
<IonHeader>
<IonToolbar style={{"--background": color, "color": "#FFF"}}>
<IonButtons slot="start">
<IonMenuButton />
</IonButtons>
<IonTitle>Agenda Diária</IonTitle>
<IonButtons slot="secondary">
<IonButton onClick={updatePage}><IonIcon slot="icon-only" icon={refreshCircleOutline} /></IonButton>
<IonBackButton defaultHref="/" icon={arrowBackCircleOutline} />
</IonButtons>
</IonToolbar>
</IonHeader>
<IonContent>
{renderedPages}
</IonContent>
</IonPage>
)
};