[react] 체크박스(checkbox) 클릭을 아예 막는 방법 (클릭해도 무반응인 상태)

By | 3월 20, 2023
  • 이렇게 하는 것이 정석인지 아닌지는 모르겠다.
  • 일단 요건은 만족하는 것으로 보인다.

type Props = {
  ...
  readOnly?: boolean; // true일 경우, 클릭해도 아무 일도 일어나지 않는다.
  ...
};

/**
 * FC
 */
const Checkbox = ({
  ...
  readOnly = false,
  ...
}: Props) => {

  return <input
    ...
    onClick={(e) => {
      if (readOnly) e.preventDefault();
    }}
    onChange={(e) => {
      if (readOnly) return;
      // do something
    }}
  />
  }
};
Subscribe
Notify of
guest
0 Comments
Inline Feedbacks
View all comments