Question

自动滚动不适用于网络聊天。在Chrome和Firefox最新版本中尝试了以下内容

对此进行了尝试，但不起作用：Microsoft BotFramework-WebChat

对此进行了尝试，但不起作用：https://github.com/microsoft/BotFramework-WebChat/issues/1031

 <!DOCTYPE html>
    <html>
    	<head>
    	<style>
    	     #webchat {
                     height: 50%;
                     width: 50%;
                     }
    	</style>
    	</head>
        <body>
          <div id="webchat" role="main"></div>
          <script src="https://cdn.botframework.com/botframework-webchat/latest/webchat.js"></script>
          <script>	
    	const styleOptions = {
                bubbleBackground: 'rgba(0, 0, 255, .1)',
                bubbleFromUserBackground: 'rgba(0, 255, 0, .1)',
    	botAvatarInitials: 'Me',
    	userAvatarInitials: 'You',
                hideUploadButton: true,			
             };
             var token = "thetoken;         
             var d1 = window.WebChat.createDirectLine({ token }); 
             var botContainer = document.getElementById('webchat');
    		
             // Tried activityMiddleware 
             const activityMiddleware = () => (next) => (card) => {
    		  return (
    			(children) => {
    			  scrollToBottom()
    			  return next(card)(children)
    			}
    		  );
    		};

             // Tried Store
             const store = window.WebChat.createStore(
             {},
             ({ dispatch }) => next => action => {
              if (action.type === 'DIRECT_LINE/INCOMING_ACTIVITY') {
                document.querySelector('ul[role="list"]').lastChild.scrollIntoView({behavior: 'smooth', block: 'start'});
              }
              return next(action);
              }
              );

            window.WebChat.renderWebChat({ directLine: d1, styleOptions }, botContainer,store );
            // tried window.WebChat.renderWebChat({ directLine: d1, styleOptions }, botContainer );
            // tried window.WebChat.renderWebChat({ directLine: d1, styleOptions }, botContainer,activityMiddleware );
    		
    		
          </script>
       </body>
    </html>

Answer 1

这与 window.WebChat.renderWebChat（{directLine：d1，store：store}，botContainer）;

Microsoft网络聊天自动滚动

1 个答案: