Наблюдаемый нокаут не срабатывает при использовании дроссельной заслонки - PullRequest
0 голосов
/ 22 февраля 2019

У меня есть следующее:

self.periodicallySave = ko.computed(function () {
    if (self.optionA() || self.optionB() || self.optionC()) {
        self.saveOptions();
    }
}).extend({ throttle: 1000 });

Я использую это значение для периодического сохранения текстовых полей по мере их обновления.Эти текстовые поля textareas и выглядят так:

    <textarea rows="2" data-bind="textInput: optionA"></textarea>

За исключением optionA, который является select.

            <select data-bind="value: optionA">
                <option>Foo</option>
                <option>Bar</option>
            </select>

По какой-то причине только OptionA запускает мою вычисляемую наблюдаемую;изменение других не имеет никакого эффекта.Я неправильно понимаю, как работают вычисляемые наблюдаемые?Я ожидаю, что, если какая-либо из этих наблюдаемых изменится, функция сработает.

Обновление:

Если я использую + вместо ||работает как положено.Странно, что OR, кажется, останавливает наблюдаемую цепочку;тем более что optionA - это select, который может содержать только одно из двух значений.Удаление optionA также дает ожидаемые результаты.

1 Ответ

0 голосов
/ 23 февраля 2019

Я думаю, что это связано со способом, которым knockout устанавливает зависимости отслеживания изменений для вычисляемой функции.Все ваши 3 наблюдаемые опции находятся внутри оператора IF, и поэтому, если первая опция начинается как true, вторые два условия замыкаются и не оцениваются.Поскольку они не оцениваются, нокаут никогда не связывается с ними.

Расчетная наблюдаемая, используемая таким образом, на мой взгляд, немного опасна, поскольку часто имеет неожиданные побочные эффекты.Вы можете легко «исправить» это поведение, развернув наблюдаемые в переменные, прежде чем проверять их значения:

self.periodicallySave = ko.computed(function () {
    var a = self.optionA();
    var b = self.optionB();
    var c = self.optionC();

    if (self.optionA() || self.optionB() || self.optionC()) {
        self.saveOptions();
    }
  }).extend({ throttle: 1000 });

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

...