2023/12/20

토이프로젝트 2 :

메뉴바에서 선택한 메뉴 배경색 바꾸는 로직 중…

<Link
  key={page.id}
  className={`${styles.sidebar_menu} ${
    selectedMenu ===  idx ? styles.selected_menu : ""
  }`}
  onClick={() => {
    setSelectedMenu(idx);
  }}
>

⇒ map 함수를 돌릴 때 선택된 기준을 idx(map 함수 2번째 인자(id를 위해))로 했었는데, 중간에 라벨이 추가될 때 변경된 배경색이 선택되었던 메뉴를 따라가지 않고 그 자리에 머무름.

<Link
  key={page.id}
  className={`${styles.sidebar_menu} ${
    selectedMenu === page.id ? styles.selected_menu : ""
  }`}
  onClick={() => {
    setSelectedMenu(page.id);
  }}
>

⇒ 그래서 menuSlice(Redux)상태관리에서 초기메뉴에 하나하나 id를 주고, 새로 추가될 라벨에도 id값을 따로 넣어줘서 중간에서 넣어줘도 id값을 따라가서 배경색도 원래 선택됐던 메뉴에 입히게 됨.

2023/12/22

토이프로젝트 2 :

라벨추가 모달창에서 중복된 라벨추가하면 추가 안되게 해놨는데 사이드바에서는 여전히 추가됨.

⇒ 추가되는 함수를 사이드바와 모달창에서 각각 다른 함수로 처리하고 있어서 추가되는 함수를 하나로 통합시킴.

토이프로젝트 2 :

중복된 라벨 이름을 넣으면, 중복라벨 이름 안 없애고 여전히 포커스 시키고 싶음.

const handleAddLabel = () => {
  if (!labelName) {
    return;
  }
  dispatch(setCreatedLabel(labelName));
	if(errorMessage) {
	  inputRef.current?.focus();
		setLabelName(labelName);
	} else {
		setLabelName("");
};

⇒이렇게 하니까 왜 그런지 모르겠는데 동작이 한 박자씩 밀림.(중복이름 넣으면 포커스 안되고 라벨 사라지고 그 다음에 중복 안된 이름 넣으면 포커스 되고 라벨 이름 안 사라짐.) ???!?!?!