diff options
author | 2019-04-17 16:30:29 +0300 | |
---|---|---|
committer | 2023-01-13 10:37:54 +0300 | |
commit | 2f9a1f07798f2ed24993034012330ff7893c9716 (patch) | |
tree | 5987c11c5731ea218b935559252e76d15fa31d1c /vnext/src/components/Thread.js | |
parent | 24b390cc7b2fb675daaad9ba904cf87b201b0542 (diff) |
Fix EventSource
Diffstat (limited to 'vnext/src/components/Thread.js')
-rw-r--r-- | vnext/src/components/Thread.js | 32 |
1 files changed, 19 insertions, 13 deletions
diff --git a/vnext/src/components/Thread.js b/vnext/src/components/Thread.js index 87babc1a..912f808f 100644 --- a/vnext/src/components/Thread.js +++ b/vnext/src/components/Thread.js @@ -1,4 +1,4 @@ -import React, { useEffect, useState, useRef } from 'react'; +import React, { useEffect, useState, useRef, useCallback } from 'react'; import PropTypes from 'prop-types'; import ReactRouterPropTypes from 'react-router-prop-types'; @@ -85,18 +85,22 @@ export default function Thread(props) { const [loading, setLoading] = useState(false); const [active, setActive] = useState(0); useEffect(() => { - if (props.connection) { - props.connection.addEventListener('msg', onReply); - } setActive(0); loadReplies(); + }, []); + useEffect(() => { + if (props.connection.addEventListener && message.mid) { + props.connection.addEventListener('msg', onReply); + }; + return () => { - if (props.connection) { + if (props.connection.removeEventListener && message.mid) { props.connection.removeEventListener('msg', onReply); } - }; - }, [props.connection]); - let loadReplies = () => { + } + }, [props.connection, message.mid]); + + let loadReplies = useCallback(() => { document.body.scrollTop = 0; document.documentElement.scrollTop = 0; @@ -119,13 +123,15 @@ export default function Thread(props) { ).catch(ex => { console.log(ex); }); - }; - let onReply = (json) => { + }, []); + let onReply = useCallback((json) => { const msg = JSON.parse(json.data); if (msg.mid == message.mid) { - setReplies([...this.state.replies, msg]); + setReplies(oldReplies => { + return [...oldReplies, msg]; + }); } - }; + }, [message]); let postComment = (template) => { const { mid, rid, body, attach } = template; comment(mid, rid, body, attach).then(res => { @@ -172,5 +178,5 @@ Thread.propTypes = { history: ReactRouterPropTypes.history, match: ReactRouterPropTypes.match, visitor: UserType.isRequired, - connection: PropTypes.shape.isRequired + connection: PropTypes.object.isRequired }; |