Записываемые вычисляемые переменные не читают значение при двойном копировании одного и того же значения - PullRequest
0 голосов
/ 24 сентября 2018

Я форматирую ввод в валюте и использую доступные для записи вычисляемые переменные, чтобы обновить значение обратно в текстовое поле.

например, у меня есть значение 1234.12. Я копирую значение из блокнота и вставляю его в текстовое поле навыведите его из функции чтения, отформатировав его в валюту, и gettimg будет записан обратно в текстовое поле как $ 1,234. Когда я вставляю то же значение 1234, он не попадает в чтение, напрямую записывается как есть, в текстовое поле как 1234 наtab.

Я видел эту проблему и в js.

Ребята, вы знаете, как отформатировать значение, если я вставляю одно и то же значение несколько раз.

1 Ответ

0 голосов
/ 24 сентября 2018

Вы можете использовать расширитель { notify: "always" }, чтобы обеспечить постоянное форматирование данных.

В приведенном ниже примере:

  • _backingValue содержит "1234"
  • При вводе "1234" в <input> вычисленный записывает "1234" в _backingValue
  • При нормальных условиях _backingValue будет не уведомлять любых подписчиков об изменении значения, начиная с "1234" === "1234. Однако , поскольку мы явно указали ему всегда вызывать valueHasMutated «событие», он уведомляет своих подписчиков.
  • formattedValue * readсвойство имеет зависимость от _backingValue.
  • Поскольку _backingValue уведомляет нас о том, что оно изменилось, функция форматирования снова запустится, выдав "1234$".
  • В нормальных условиях formattedValue не уведомит любых подписчиков об изменении значения, поскольку "1234$" === "1234$".Однако опять же из-за расширения запускается valueHasMutated.
  • Привязка значения <input>'s получает обновление и отображает "1234$" на экране.

const _backingValue = ko.observable("1234")
  .extend({ notify: "always" });

const formattedValue = ko.computed({
  read: () => _backingValue().replace(/\$/g, "") + "$",
  write: _backingValue
}).extend({ notify: "always" });


ko.applyBindings({ formattedValue });
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.2/knockout-min.js"></script>
<input data-bind="value: formattedValue">
...