Marbes/Luncher
5
2
Fork 0
Code Issues 6 Pull Requests Packages Projects Releases Wiki Activity

Přepracování loginu přes ref

Browse Source
This commit is contained in:
Martin Berka 2023-06-02 20:07:14 +02:00
parent 00047e7183
commit 16bb467bcd
1 changed files with 6 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
client/src/Login.tsx
View File

@ -1,4 +1,4 @@
import { useState } from 'react'; import React, { useRef } from 'react';
import { Button } from 'react-bootstrap'; import { Button } from 'react-bootstrap';
import { useAuth } from './context/auth'; import { useAuth } from './context/auth';
import './Login.css'; import './Login.css';
@ -8,16 +8,17 @@ import './Login.css';
*/ */
export default function Login() { export default function Login() {
const auth = useAuth(); const auth = useAuth();
const [loginName, setLoginName] = useState<string>(''); const loginRef = useRef<HTMLInputElement>(null);
if (!auth || !auth.login) { if (!auth || !auth.login) {
return <div className='login'> return <div className='login'>
<div className='login-inner'> <div className='login-inner'>
<p style={{ fontSize: "12px", marginTop: "10px" }}>Zobrazované jméno by mělo být ideálně vaše jméno a příjmení, nebo přezdívka, pod kterou vás kolegové dokážou snadno identifikovat. Jméno lze kdykoliv upravit/smazat v local storage prohlížeče.<br />PS: Enter nefunguje</p> <p style={{ fontSize: "12px", marginTop: "10px" }}>Zobrazované jméno by mělo být ideálně vaše jméno a příjmení, nebo přezdívka, pod kterou vás kolegové dokážou snadno identifikovat. Jméno lze kdykoliv upravit/smazat v local storage prohlížeče.<br />PS: Enter nefunguje</p>
Zobrazované jméno: <input style={{ marginTop: "10px" }} onChange={(e) => setLoginName(e.target.value)} type='text' /> Zobrazované jméno: <input style={{ marginTop: "10px" }} ref={loginRef} type='text' />
<Button onClick={() => { <Button onClick={() => {
if (loginName?.length > 0) { // Netuším proč mě TypeScript seřve když se to pokusím zchainovat dohromady
auth?.setLogin(loginName); if (loginRef?.current?.value && loginRef?.current?.value.length > 0) {
auth?.setLogin(loginRef.current.value);
} }
}} style={{ marginTop: "20px" }}>Uložit</Button> }} style={{ marginTop: "20px" }}>Uložit</Button>
</div> </div>