-
Notifications
You must be signed in to change notification settings - Fork 0
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
[Refactor]: useFocusInput 다른 input에서도 쓸 수 있도록 변경 #310
Conversation
The latest updates on your projects. Learn more about Vercel for Git ↗︎
|
만약 다른 엘리먼트도 focus를 주신다면, import { useEffect, useRef } from 'react';
const useFocus = <T = null>(isFocus: boolean) => {
const focusEl = useRef<T>(null);
useEffect(() => {
if (isFocus || !(focusEl.current instanceof HTMLElement)) {
return;
}
focusEl.current.focus();
}, [isFocus]);
return { focusEl };
};
export default useFocus;
//---------- 사용할 때 --------------//
const { focusEl } = useFocusInput<HTMLButtonElement>(true);
<button ref={focusEl}>ㅎㅇ</button> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
div 등에 focus를 주는건 어떤 효과일까요? 필요한 이유가 있나요??
+ @loevray
type이 mutableRef 여야함 (focusElement.current에 값을 넣기 위해서)
ref={(e) => {
ref(e);
focusInput.current = e;
}}
종욱님이 남기신거처럼 react-hook-form사용할때 ref에 할당하려면, 지금처럼 const focusInput = useRef<HTMLInputElement | null>(null);
로 해야 mutableRef
타입이 되는데,
영현님이 코멘트 주신것 처럼 제네릭을 쓰면 이부분이 문제가 되는것 같아요!
잘못이해한걸까요
저는 useRef를 dom제어용으로 사용하시는 줄 알았는데, 값 할당도 필요햇던걸까요?! 👀 |
-> 지금으로서는 input에만 사용하는 훅으로 남겨두는 것이 좋을 것 같은데 어떻게 생각하시나요?! 👀 @loevray @yejinleee @joonwonBaek |
제가 생각하기로는, input에만 두어도 될것 같습니다! |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
고생하셨습니다 ㅎㅎ
ci테스트겸 빈 커밋 하나 올려주실수 있으신가요?
📋 Issue Number
close #302
💻 구현 내용
📷 Screenshots
🤔 고민사항
👀 문제점
1. 현재 상황
2. 겪고 있는 문제
3. 해결 방안
??????