Ractive и массивы, данные не обновляются

Я изучаю, как использовать ractive и не могу решить проблему, код находится в следующем jsfiddle.

Суть того, что я делаю, - это счетчики для очереди (последний объект в массиве - текущий человек): 1. Счетчик для отображения номера очереди текущего человека 2. Счетчик для отображения размера очереди

А) работает правильно, но раздута логикой, поэтому я попытался преобразовать ее в отдельную переменную, как показано в Б), но она вообще не обновляется.

Я поместил наблюдателя в код, чтобы следить за любыми изменениями в переменной очереди. Я ожидаю, что он будет показывать предупреждение каждый раз, когда я нажимаю «пропустить текущего человека» или «удалить текущего человека», но предупреждение появляется только при первой загрузке страницы.

    ractive.observe({
      'queue.0.queueNo': alert('here')
    });

javascript ractivejs
person trashbear    schedule 19.09.2013    source источник
comment
Вы не меняете их очередьНет - данные остаются прежними, а весь объект перемещается спереди назад   -  person MDEV    schedule 19.09.2013
comment
Я должен был сделать свои переменные более очевидными, queueNo — это атрибут элемента. Я имел в виду queueNum, это ключ, определенный в хэше данных ractive объекта.   -  person trashbear    schedule 20.09.2013

Ответы (2)


arrow_upward
3
arrow_downward

вы можете сделать queueNum функцией, основанной на очереди, например:

num: function(q) { return q[(q.length-1)].queueNo;}

и назовите это так: {{num(queue)}} теперь, когда очередь или люди обновляются, реактивный знает, что он должен обновить число до. Вам даже не нужно вызывать ractive.update(). Для наблюдения также сделайте это функцией, и она будет работать:

ractive.observe({
    'queue.0.queueNo': function(a,b) { alert('here');}
});
person Wim    schedule 20.09.2013
comment
Спасибо теперь работает! Знаете ли вы, почему я не мог использовать свой номер очереди, как в моем примере (настроен на чтение из массива людей)? Мне просто любопытно, как очередь обновляется правильно, поэтому я ожидал такого же поведения от queueNum. - person trashbear; 20.09.2013
comment
Не знаю точной внутренней работы ractive, поэтому не знаю, почему это не работает. Просто мой собственный опыт с Ractive, что это работает так. - person Wim; 24.09.2013

arrow_upward
6
arrow_downward

Ответ Вима хороший - {{num(queue)}} - элегантное решение.

Причина, по которой вы не можете использовать queueNum, заключается в том, что когда вы делаете

queueNum = people[(people.length-1)].queueNo

значение queueNum устанавливается равным любому значению people[(people.length-1)].queueNo во время оператора. При изменении очереди queueNum не подвергается повторной оценке. Это не столько Ractive, сколько JavaScript.

Другой способ сказать, что это

a = 1;
b = 2;
foo = a + b; // foo === 3

a = 3;
b = 4;
alert( foo ); // alerts '3' - foo is the same, even though a and b changed

На самом деле это та же причина, по которой alert('here') срабатывал только при загрузке страницы - вместо того, чтобы сообщать Ractive о необходимости запускать предупреждение при изменении значения, заключая его в функцию, как во втором блоке кода ответа Вима, код был выполнен немедленно.

person Rich Harris    schedule 24.09.2013
comment
Спасибо за ответ, Рич, это прояснило ситуацию. Я новичок в программировании в целом, поэтому объяснение javascript было полезным. - person trashbear; 28.09.2013