Почему div.scrollTop = div.scrollHeight отключается одним сообщением при прокрутке? - PullRequest
Новая
       39

Почему div.scrollTop = div.scrollHeight отключается одним сообщением при прокрутке?

1 голос
/ 05 апреля 2020

Я создаю приложение для обмена сообщениями на основе MERN. Это довольно просто, но когда я применяю этот код к div, кажется, что эффект только прокручивает сообщения до самого последнего сообщения. Таким образом, когда вы полностью прокручиваете сообщения до конца и отправляете / получаете новое сообщение, новое сообщение опускается ниже в переполнение, и прокрутка не перемещается. Следующее сообщение после этого опускается ниже, и сообщение перед отправкой выводится на экран. Так что если вы не используете ручную прокрутку, это всегда позади.

Вот код, о котором идет речь: 

 const scrollDiv = document.getElementById('chat-feed-container');

  return selectedConversation.length > 0 ? (
    ((scrollDiv.scrollTop = scrollDiv.scrollHeight),
    (
      <div id='chat-feed' className='col s8 chat-feed'>
        <div id='chat-feed-container'>
          {selectedConversation[0].messages.map((message, i) => (
            <div key={i}>
              <Message message={message} />
            </div>
          ))}
        </div>
      </div>
    ))
  ) : (
    <div className='col s8 chat-feed'>
      <div id='chat-feed-container'>
        <h6>No messages yet!</h6>
      </div>
    </div>
  );

Любая причина, по которой вы можете думать об этом?

Вот репо на тот случай, если вы хотите поближе взглянуть, и этот код взят из компонента сообщений: https://github.com/sszukhent/telegramish

...