타이핑 마지막 글자가 한글일때 값이 남아있는 트러블

문제  

타이핑 마지막 글자가 한글일때 값이 남아있는 트러블

시도 

onKeyDown 함수가 실행이될때 작동하는 함수를 만들어서 시도했지만.. 작동하지 않았다.

해결 

endsWith() 메서드를 사용하여 따라칠 문장 끝 글자와 내가 쓴 inputValue 마지막 글자가 동일 할때만  넘어가도록 구현하여 해결했다.

 

 

기존 코드 

  const onKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {
    if (e.key === "Enter") {
      if (typingValue.length === currentTypingText?.contents.length) {
        hadleSumit();
        setTypingValue("");
        setTimeCheck(false);
        setIncorrectIndices([]);
      }
    }
  };

 

수정 코드

  const onKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {
    if (e.key === "Enter") {
      const currentContents = currentTypingText?.contents;

      if (currentContents && typingValue.endsWith(currentContents.slice(-1))) {
        hadleSumit();
        setTypingValue("");
        setTimeCheck(false);
        setIncorrectIndices([]);
      }
    }
  };