修复登录部分bug

sanyuan0704 · Sep 3, 2019 · 82442bb · 82442bb
1 parent 259e49d
commit 82442bb
Show file tree

Hide file tree

Showing 5 changed files with 21 additions and 15 deletions.
diff --git a/src/application/User/Login/components/PhoneForm/step-one/index.js b/src/application/User/Login/components/PhoneForm/step-one/index.js
@@ -9,10 +9,6 @@ const StepOne = props => {
   }, []);
   return (
     <>
-      <p className="tips">
-        &emsp;&emsp;暂时不支持验证码登录，请输入手机号和密码
-      </p>
-
       <p className="input">
         +86
         <input

diff --git a/src/application/User/Login/components/PhoneForm/step-two/index.js b/src/application/User/Login/components/PhoneForm/step-two/index.js
@@ -4,35 +4,35 @@ import { VcodeBox, Container } from "./style";
 const maxLength = 4;
 const StepTwo = props => {
   const { phone, triggerLogin } = props;
+  const [triggered, setTriggered] = useState(false);
   const [cursorIndex, setCursorIndex] = useState(0);
   const [vcode, setVcode] = useState("");
   const [timer, setTimer] = useState(60);
   const inputRef = useRef();
 
   useEffect(() => {
-    inputRef.current.focus();
     let theTimer;
     if (!theTimer) {
       theTimer = setInterval(() => {
         setTimer(timer => timer - 1);
+        if(timer <= 0) clearTimeout(theTimer);
       }, 1000);
     }
     return () => {
       clearTimeout(theTimer);
     };
-  }, [vcode]);
+  }, [timer]);
 
   useEffect(() => {
-    if (vcode.length === 4) {
+    if (vcode.length === 4 && !triggered) {
       triggerLogin(vcode);
+      setTriggered(true);
     }
-  }, [vcode, triggerLogin]);
+  }, [vcode, triggerLogin, triggered]);
 
   const onChangeVcode = e => {
+    if(!e.target.value) return;
     const val = e.target.value;
-    if (!val) {
-      return;
-    }
     setVcode(val);
     setCursorIndex(val.split("").length);
   };
@@ -63,7 +63,7 @@ const StepTwo = props => {
               key={idx}
               className={`line ${cursorIndex === idx ? "animated" : ""}`}
             >
-              {vcode.split("")[idx]}
+              {vcode[idx]}
             </label>
           ))}
         </div>

diff --git a/src/application/User/Login/store/actionCreators.js b/src/application/User/Login/store/actionCreators.js
@@ -3,7 +3,7 @@ import {
   sentVcodeRequest,
   loginByVcodeRequest
 } from "../../../../api/request";
-import { CHANGE_USER_INFO, CHANGE_SENT_STATUS } from "./constants";
+import { CHANGE_USER_INFO, CHANGE_SENT_STATUS, CHANGE_IS_LOGIN } from "./constants";
 
 export const saveUserInfo = data => ({
   type: CHANGE_USER_INFO,
@@ -15,6 +15,11 @@ export const saveSentStatus = data => ({
   data
 });
 
+export const changeIslogin = data => ({
+  type: CHANGE_IS_LOGIN,
+  data
+});
+
 export const loginByPhone = (phone, password) => {
   return dispatch => {
     loginByPhoneRequest(phone, password)
@@ -51,4 +56,4 @@ export const sentVcode = phone => {
         console.log("请求失败！");
       });
   };
-};
+};
diff --git a/src/application/User/Login/store/constants.js b/src/application/User/Login/store/constants.js
@@ -1,3 +1,5 @@
 export const CHANGE_USER_INFO = "user/login/CHANGE_USER_INFO";
 
 export const CHANGE_SENT_STATUS = "user/login/CHANGE_SENT_STATUS";
+
+export const CHANGE_IS_LOGIN = "user/login/CHANGE_IS_LOGIN";
diff --git a/src/application/User/Login/store/reducer.js b/src/application/User/Login/store/reducer.js
@@ -3,7 +3,8 @@ import { fromJS } from "immutable";
 
 const defaultState = fromJS({
   userInfo: {},
-  sentStatus: false
+  sentStatus: false,
+  isLogin: false
 });
 
 export default (state = defaultState, action) => {
@@ -12,6 +13,8 @@ export default (state = defaultState, action) => {
       return state.set("userInfo", action.data);
     case actionTypes.CHANGE_SENT_STATUS:
       return state.set("sentStatus", action.data);
+    case actionTypes.CHANGE_IS_LOGIN:
+      return state.set("isLogin", action.data);
     default:
       return state;
   }