/
githubmirror
/
socket.io
Обзор
Документация
Войти
/
githubmirror
/
socket.io
Код
Запросы
0
Пакеты
0
Релизы
0
Аналитика
Безопасность
main
examples/private-messaging/src/App.vue
78 строк
2 KB
Damien Arrachequesne
docs(examples): bump dependencies for the private messaging example
02 май 2023, 19:07
Не верифицирован
02 май 2023, 19:07
cbf0362
Код
Авторство
О чём код?
<template> <div id="app"> <select-username v-if="!usernameAlreadySelected" @input="onUsernameSelection" /> <chat v-else /> </div> </template> <script> import SelectUsername from "./components/SelectUsername"; import Chat from "./components/Chat"; import socket from "./socket"; export default { name: "App", components: { Chat, SelectUsername, }, data() { return { usernameAlreadySelected: false, }; }, methods: { onUsernameSelection(username) { this.usernameAlreadySelected = true; socket.auth = { username }; socket.connect(); }, }, created() { const sessionID = localStorage.getItem("sessionID"); if (sessionID) { this.usernameAlreadySelected = true; socket.auth = { sessionID }; socket.connect(); } socket.on("session", ({ sessionID, userID }) => { // attach the session ID to the next reconnection attempts socket.auth = { sessionID }; // store it in the localStorage localStorage.setItem("sessionID", sessionID); // save the ID of the user socket.userID = userID; }); socket.on("connect_error", (err) => { if (err.message === "invalid username") { this.usernameAlreadySelected = false; } }); }, destroyed() { socket.off("connect_error"); }, }; </script> <style> body { margin: 0; } @font-face { font-family: Lato; src: "~/public/fonts/Lato-Regular.ttf"; } #app { font-family: Lato, Arial, sans-serif; font-size: 14px; } </style>