[教室ノート][返信]ユーザネットワーク
2094 ワード
const useNetwork = onChange => {
const [status, setStatus] = useState(navigator.onLine); // true 또는 false 값
const handleChange = () => {
if (typeof onChange === "function") {
onChange(navigator.onLine);
}
setStatus(navigator.onLine);
};
useEffect(() => {
window.addEventListener("online", handleChange);
window.addEventListener("offline", handleChange);
() => {
window.removeEventListener("online", handleChange);
window.removeEventListener("offline", handleChange);
};
}, []);
return status;
};
const App = () => {
const onNetworkChange = isOnline => {
console.log(isOnline ? "We are back online" : "We just got offline");
};
const online = useNetwork(onNetworkChange);
return (
<div className="App">
<h1>{isOnline ? "We are online" : "We are offline"} </h1>
<p>Welcome</p>
</div>
);
};
Reference
この問題について([教室ノート][返信]ユーザネットワーク), 我々は、より多くの情報をここで見つけました https://velog.io/@interstellayang/강의노트-React-useNetworkテキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。
Collection and Share based on the CC Protocol