how to rerender component, when access store prop on component level?

Hi Guys,

I have a store, which I have a property to be edited. Once the property is set, a modal should open, if the property is unset, the model closes.

something like this:

const [stores, setStore] = createStore({
    ticket: { id: 1, name: 'My first ticket' },
});

function TicketModal() {
    const ticket = stores.ticket;

    createEffect(() => {
        console.log(stores.ticket);
    });

    if (ticket) {
        return <>render Modal</>;
    }

    return <>no Modal</>;
}

const [stores, setStore] = createStore({
    ticket: { id: 1, name: 'My first ticket' },
});

function TicketModal() {
    const ticket = stores.ticket;

    createEffect(() => {
        console.log(stores.ticket);
    });

    if (ticket) {
        return <>render Modal</>;
    }

    return <>no Modal</>;
}

const [stores, setStore] = createStore({
    ticket: { id: 1, name: 'My first ticket' },
});

function TicketModal() {
    const ticket = stores.ticket;

    createEffect(() => {
        console.log(stores.ticket);
    });

    if (ticket) {
        return <>render Modal</>;
    }

    return <>no Modal</>;
}

const [stores, setStore] = createStore({
    ticket: { id: 1, name: 'My first ticket' },
});

function TicketModal() {
    const ticket = stores.ticket;

    createEffect(() => {
        console.log(stores.ticket);
    });

    if (ticket) {
        return <>render Modal</>;
    }

    return <>no Modal</>;
}

but this wont work. If I wrap my access on the ticket of the store in a create effect, I can see it changes.

what I thought of, to create a signal, set the signal via createEffect, and then render the modal. But I like to avoid this approach. is there a better way?

how to rerender component, when access store prop on component level?

Similar Threads

Similar Threads

Similar Threads