Вызов порта после просмотра обновляется в Elm

Question

Есть ли простой способ иметь Cmd выполнить после обновления представления? В частности, я пытаюсь переместить курсор в textarea после нажатия определенных клавиш (например, клавиши ввода). В моем update функция у меня есть:

case keyboardEvent.key of
    "Enter" ->
        ( modelAfterEnterPressed model keyboardEvent.selectionStart, setCursor model.cursor )
    "Tab" ->
        ....

мой setCursor порт вызывается и соответствующий код JavaScript вызывает textarea"s setSelectionRange работает правильно. И тогда Элм называет мой view функция, которая обновляет textareaсодержание. К сожалению, это стирает мою позицию курсора.

Мне нужно для textareaсодержимое будет обновлено перед звонком textarea.setSelectionRange() в моем порту JavaScript. Любой способ сделать это, не прибегая к setTimeout что не всегда может работать и может вызвать вспышки в течение тайм-аута?

Answer 1

Стандартный способ сделать это - вызвать команду, которая возвращает следующий тик, например, Date.now, и затем запустить команду порта из этого сообщения. Это гарантирует, что функция просмотра будет работать, и ваша текстовая область присутствует.

Альтернатива, которая, по моему опыту, хорошо работает, заключается в замене setTimeout (с произвольным интервалом) с помощью requestAnimationFrame:

elm.ports.selectText.subscribe( () => {
  requestAnimationFrame( () => {
    var textarea = document.querySelector(...);
    textarea.setSelectionRange();
  });
});

Это сработает после view было оказано тоже.