Come si aggiorna uno stato client con uno stato del server in Vue o in altri framework reattivi

Question

Come si aggiorna uno stato client con uno stato del server in Vue o in altri framework reattivi

#1 da (1 voti)

1

Hai un server che invia i dati del cliente. Un oggetto JSON. {"name": "folder1", size: "2406"}

Il client aggiorna i suoi dati: data = newData

E il client è aggiornato. Codifica reattiva del frontend come al solito.

Tuttavia, il client deve mantenere il proprio stato. Ha anche isOpen per quella cartella. Quindi l'oggetto è simile a questo. {"name": "folder1", "size": "2406", "isOpen": false}

Ciò consente all'utente di alternare la cartella aperta e chiusa.

Tuttavia non possiamo più assegnarlo ai dati del cliente quando nuovi dati provengono dal server, perché la proprietà isOpen verrebbe sovrascritta. data = newData // isOpen is gone now

1 soluzione sarebbe quella di avere una fusione dei dati quando proviene dal server. Sembra buono ma sciatto.

Un altro sarebbe mantenere 2 stati diversi. Sembra molto sciatto.

Qual è il modo migliore per gestire i dati solo client in un'applicazione reattiva?

reactjs client-server reactive

posta user974407 03.07.2017 - 16:42

fonte

1 risposta

Leggi altre domande sui tag reactjs client-server reactive

Idee per gestire le dipendenze in un'architettura web basata su componenti Pubblica e sottoscrivi (trasferimento dati) con nodi permanenti offline. Le code dei messaggi si adattano bene?

score 1 · Answer 1

1 solution would be to have a merging of the data when it comes from the server. That seems fine but sloppy.

Perché consideri l'unione come sciatta? Penso che questa sia la soluzione appropriata al tuo problema dichiarato. Vorrei incapsulare questa logica in una funzione:

updateState(prevState, newState) {
  // merge new state into prev state and return the merged state
}

data = updateState(data, newData)

In un framework come React, il tuo stato è gestito, quindi farei la stessa cosa come sopra ma con this.state e this.setState() chiamate.

Another would be to maintain 2 different states. That seems very sloppy.

In un'applicazione React + Redux di solito memorizzo i dati condivisi nell'archivio redux (di solito proviene dal back-end) e memorizza solo il componente - lo stato transitorio nello stato del componente React. Questo potrebbe non essere adatto alle tue esigenze. Lo stato del server deve essere persistente attraverso lo smontaggio dei componenti? Lo stato del client deve essere persistente attraverso lo smontaggio dei componenti?