В Meteor, как показывать вновь вставленные данные как серые, пока они не будут подтверждены сервером?

Скажите, что мое приложение имеет список элементов какого-либо типа, и пользователи могут вставлять новые элементы в список.

Обычно Meteor делает это: когда пользователь вставляет элемент в список, он сразу появляется в браузере, не дожидаясь подтверждения сервера.

Я хочу: когда элемент находится в этом состоянии (отправлен, но еще не подтвержден сервером), он отображается в правильной позиции в списке, но неактивен.

Есть ли способ заставить Метеор сделать это?

Ответы

Ответ 1

Конечно. Сделайте метод, который выполняет вставку. Когда этот метод запускается, попросите его проверить, работает ли он в симуляции, и если да, установите флажок "временно" или "неподтвержденный" во вставленном элементе. Используйте это, чтобы решить, нужно ли отображать элемент как greyed вне.

Предполагая, что вы используете 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});
  }
});

Вызов метода:

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

Это все, что вам нужно сделать. Причина этого в том, что после того, как сервер завершит сохранение элемента, локальные (имитируемые) изменения на клиенте будут отменены и заменены тем, что на самом деле произошло на сервере (который не будет включать флаг "неподтвержденный" ).

Это самый простой способ сделать это, но это приведет к тому, что все записи в вашей базе данных, имеющие "подтвержденный" attrbiute истины. Чтобы этого избежать, установите только подтвержденный атрибут, если он неверен.

Обратитесь к этой части документации за дополнительной информацией о isSimulation и Meteor.methods

Ответ 2

Это то, что я добавил наблюдателя на стороне сервера, Я создал переменную с именем notify false с самой клиентской стороны как только сервер получит udpate, он будет уведомлять об этом истину, и клиент будет обновлен на том же уровне.

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