Прокрутка до дна; scrollTop = scrollHeight слишком рано? - PullRequest
3 голосов
/ 21 мая 2019

Пример: https://angular -txvcna.stackblitz.io / ( Код ).

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

Я добавляю новое сообщение, помещая элемент в массив (this.messages.push(message)), и пытаюсь прокрутить вниз, сразу после этого,Похоже, что операция прокрутки this.chatboxBody.nativeElement.scrollTop = this.chatboxBody.nativeElement.scrollHeight; выполняется перед угловыми хуками жизненного цикла, потому что scrollHeight имеет старшее значение высоты в качестве оправдания.

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

1 Ответ

1 голос
/ 21 мая 2019

У меня есть пара идей:

  1. Вы можете изменить ввод сообщений на установщик, чтобы при вводе сообщения он устанавливал закрытую версию сообщения и обрабатывал прокрутку внутри компонента. (Лично мне кажется, что это лучшее решение, так как тогда логику прокрутки до дна не нужно будет повторять в каждом месте, где используется этот компонент)
    private _message: VivrMessage;
        @Input()
            set message(val: VivrMessage){
        if (val){
            this._message = val;
            this.handleScrolling();
        }
    }
  1. Вы можете сделать то же самое, что и выше, но вместо того, чтобы обрабатывать прокрутку в компоненте сообщений, есть выход, в котором родительский компонент будет выполнять свою работу.
...