Content does not appear

Asked

Viewed 8 times

-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>
)

};

No answers

Browser other questions tagged

You are not signed in. Login or sign up in order to post.