[TIL] 내배캠4기-React Native-61일차

hare·2022년 12월 30일
0

내배캠-TIL

목록 보기
45/75
  • 리액트 네이티브 Alret 문법
  • 자바스크립트 구조분해할당
  • map, filter 메서드의 특징

Alret API

Alret.API("문자열","문자열",[{왼},{오}])

Alert.alert("Task 삭제", "정말 삭제하시나요?", [
      {
        text: "취소",
        style: "cancel",
      },
      {
        text: "확인",
        style: "destructive",
        onPress: () => {
          setTodos((prev) => prev.filter((item) => item.id !== id));
        },
      },
    ]);

구조분해할당으로 value값만 바꾸기

map으로 순회하며 객체 키를 찾고 바꾸고자하는 밸류값만 바꿔주었다.

// 여기 구조분해 할당으로..할수있지않나.?
    setTodos((prev) =>
      prev.map((item) => {
        if (item.id === id) {
          //item.isDone: !isDone 도 아니고 isDone: !isDone도 아닌 이것이다..
          return { ...item, isDone: !item.isDone };
        } else {
          return item;
        }
      })
    );

item.isDone: !isDone 도 아니고 isDone: !isDone도 아니다.

isDone : !item.isDone 으로 써야 에러가 안난다..
계속 에러가 나서..;; 🔥

+ 얕은복사를 이용하는 다른 방식

const newTodos = [...todos];
    const idx = newTodos.findIndex((todo) => todo.id === id);
    newTodos[idx].isDone = !newTodos[idx].isDone;
    setTodos(newTodos);

immutable 메서드

💡 리마인드!

map, filter 메서드 : immutable

  • 새로운 배열로 리턴

push : mutable

  • 기존 배열을 수정
profile
해뜰날

0개의 댓글