我想加入注冊時如果我在我的ID中輸入韓語回傳false的功能，但它并不適用-有解無憂

我正在為注冊進行身份驗證。如果輸入長度小于 6 個字符或韓文字符，它會列印出 false 并將值交給 styled 組件，并通過該值進行條件渲染。如果我通過 RegExp 接收韓語，我回傳 false 并且 RegExp 在代碼中。字符數很好，但即使我收到韓語也不適用。沒有錯誤，但我認為和弦是錯誤的。你能告訴我如何解決嗎？

SignUpUserInput.jsx：

import React, { useState } from 'react'
import styled from 'styled-components';
import redX from '../../resources/images/img/redX.png'

const InputWrap = styled.div`
  align-items: center;
  -webkit-appearance: none;
  background: rgb(250, 250, 250);
  border: 1px solid rgb(219, 219, 219);
  border-radius: 3px;
  box-sizing: border-box;
  color: rgb(38, 38, 38);
  display: flex;
  flex-direction: row;
  font-size: 14px;
  position: relative;
  width: 100%;

  .userIdCheck {
    //conditional rendering
    display: ${props=>props.isUserName===true?'none':'flex'};
    align-items: center;
    border: 0;
    box-sizing: border-box;
    flex: 0 0 auto;
    flex-direction: row;
    font: inherit;
    font-size: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    padding-right: 8px;
    position: relative;
    vertical-align: middle;
  }

  .userIdCheckWrap {
    border: 0;
    font: inherit;
    font-size: 100%;
    margin: 0;
    margin-left: 8px;
    padding: 0;
    vertical-align: baseline;
    background-repeat: no-repeat;
    background-position: -249px -333px;
    height: 22px;
    width: 22px;
  }
`

function SignUpUserInput({userName,setUserName}) {

  const [isUserName, setIsUserName] = useState(false);
  const onChangeName = (e) => {

    // RegExp
    const regex = /^[?-?|?-?] $/;
    const userNameInput = e.target.value

    if(userNameInput.length<6) {
      setIsUserName(false)
    }

    else if (regex.test.userNameInput){
      setIsUserName(false)
    }

    else {
      setIsUserName( true)
    }
  }

  return (
    <InputWrap isUserName={isUserName}>
      <label className='inputLabel'>
        <span className='inputHover'>
          ??? ??
        </span>
        <input className='inputInput' value={userName} onChange={(e)=>{setUserName(e.target.value); onChangeName(e);}}/>
      </label>
      <div className='userIdCheck'>
        <span className='userIdCheckWrap'>
          <img src={redX} alt='redX' />
        </span>
      </div>
    </InputWrap>
  )
}

export default SignUpUserInput;

uj5u.com熱心網友回復：

看起來您正在檢查regex.test.userNameInput，它正在尋找一個名為userNameInputon的屬性test。test是一個回傳 a 的方法boolean。嘗試

    else if (regex.test(userNameInput)){
      setIsUserName(false)
    }

轉載請註明出處，本文鏈接：https://www.uj5u.com/qianduan/525303.html

標籤：javascript反应

上一篇：物件陣列的型別和介面設定錯誤

下一篇：在ReactJS上對映射陣列進行排序