En Meteor, ¿cómo muestro los datos recién insertados como en gris hasta que el servidor los ha confirmado?

Question

Supongamos que mi aplicación tiene una lista de elementos de algún tipo y los usuarios pueden insertar nuevos elementos en la lista.

Lo que normalmente hace Meteor es: cuando un usuario inserta un elemento en la lista, aparece en su navegador de inmediato, sin esperar la confirmación del servidor.

Lo que quiero es: cuando un elemento se encuentra en este estado (enviado pero aún no reconocido por el servidor), aparece en su posición correcta en la lista, pero atenuado.

¿Hay alguna manera de hacer que Meteor haga esto?

Answer 1

Sure. Haz un método que haga la inserción. Cuando se ejecuta el método, haga que verifique si se está ejecutando en simulación y, de ser así, establezca un indicador "temporal" o "no confirmado" en el elemento insertado. Úselo para decidir si desea convertir el elemento en gris.

Suponiendo que estamos usando MongoDB:

// Put this in a file that will be loaded on both the client and server 
Meteor.methods({ 
    add_item: function (name) { 
    Items.insert({name: name, 
        confirmed: !this.isSimulation}); 
    } 
}); 

Al llamar al método:

Meteor.call("add_item", "my item name"); 

Eso es todo lo que necesita hacer. La razón por la que esto funciona es que una vez que el servidor ha terminado de guardar el elemento, los cambios locales (simulados) en el cliente se restituirán y reemplazarán con lo que realmente sucedió en el servidor (que no incluirá el indicador 'no confirmado').

lo anterior es la forma más sencilla de hacerlo, pero se traducirá en todos los registros en su base de datos que tienen una 'confirmó' attrbiute de verdad. Para evitar esto, solo configure el atributo confirmado si es falso.

Consulte esta parte de la documentación para obtener más información sobre isSimulation y Meteor.methods

Answer 2

Esto es lo que he añadido un observador situado en el lado del servidor, he creado una variable llamada notifique falso de lo mismo lado del cliente una vez que el el servidor recibe el udpate hará que la notificación sea verdadera y el cliente se actualizará en el mismo.

Collection.find({"notify":false}).observe({ 
    "added" : function(first){ 
     collection.update({"_id":first._id},{$set : {"notify":true}}); 
    } 
});