TIL/20210828

📌今日やったこと

-ニックネームを変更します.
-パスワードの変更
-共有図鑑の許可/非図鑑の許可
-パスワードの再発行
開発が終わりに近づくとapi設計図を参照する必要は少なく、新しい機能の追加に伴い、api設計図を久しぶりに見ることができます.

1)ニックネームの変更
ニックネームは私たちのプロジェクトで唯一の値なので、変更時にも重複しているかどうかを確認します.
リアルタイムdispatch入力したニックネームが重複しているかどうかを確認します.

import {checkNickname} from "../redux/async/user";
const [nickname, setNickname] = useState(""); //닉네임
const doubleCheckNickname = useCallback(() => {
        dispatch(checkNickname(nickname));
    }, [nickname]); //닉네임 중복체크 디스패치

    const clickNickConfirm=()=>{//변경된 정보 사항으로 디스패치
        if(nickname === ""){
            setNickname("");
            alert("닉네임을 다시 확인 해주세요!")
            return;
        } //공란 체크
        if(is_nickname?.message === "fail" && is_nickname?.error === "exist nickname"){
            setNickName_Double(false);
            setNickname("");
            alert("사용중인 닉네임입니다.");
            return;
        }
        else if(is_nickname?.message === "fail" && is_nickname?.error === "wrong nickname"){
            setNickName_Double(false);
            setNickname("");
            alert("사용할 수 없는 닉네임입니다.");
            return;
        }else if(nickname.length >= 8 ){
            setNickname("");
            alert("닉네임 글자 수는 8자 미만이어야합니다.");
            return;
        }else{
            setNickName_Double(true);
            if(window.confirm("닉네임을 변경하습니까?")){
                if(dispatch(changeNickname(nickname)))
                    setNick_Change(false);
            }
            return;
        }
    }

パスワードの変更
パスワードも同じです.ニックネームのように有効性をチェックしました.

ビール図鑑
ビール図鑑の許可/使用不可はちょっと難しいです.switchボタンをクリックすると、権限はすぐに「許可/許可なし」に変更され、実際のスイッチも変更する必要がありますが、ボタンの状態をリアルタイムで反映できないという困難があります.
従来の讃機能に適用したように,切替機能を利用して共有許可/非許可状態切替を行う方法を試みた.

const [toggle,setToggle] = useState("");
const clickSwitch = ()=>{//맥주 도감 공유 허용/비허용 상태 전환
        if(toggle===true){
            dispatch(shareDisagree()); //비허용 상태 전환 디스패치
            setToggle(false);
        }else{
            dispatch(shareAgree()); //허용 상태 전환 디스패치
            setToggle(true);
        }
    }
return (
        <>
 		<InfoWrap>
                    <JustifyAlign>
                    <span>{"맥주 도감 공유 허용하기"}</span>
                    <div style={{float: "right"}}>
                    <CustomizedSwitches //스위치 버튼 컴포넌트
                      setState={setState}
                      state={state}
                      clickSwitch={clickSwitch}
                      toggle={toggle}
                  /></div>
               	 </JustifyAlign>
         </InfoWrap>            
            
        </>

パスワードの再送信
最後にパスワード補完機能も追加されました.


1ヶ月前まではaxiosが何なのか、redux-toolkitがどのように使われているのか分かりませんでしたが、今は接続しやすいようです.また,素子をどのように分割するかについてのより効果的な苦悩を開発する前に,自然に行われる.今はこれ以上の追加機能はありませんが…!
まだ試したことのないnextjs、反応型、タイピングなども単独で勉強しましょう.