React Router에서 저장소 데이터 삭제하기

우리의 애플리케이션은 새로운 제품을 추가하고, 데이터를 수정할 수 있습니다. 이제 데이터 삭제 기능만 추가하면 됩니다. 이를 위해 우리는 이전 강의들에서 익숙해진 단계들을 다시 따라갈 것입니다.

먼저 forStorage.js 파일을 열고 특정 id를 가진 제품을 삭제하는 마지막 함수 deleteProduct를 추가하겠습니다:

export async function deleteProduct(id) {}

그런 다음 저장소에서 제품 목록을 가져와 삭제하려는 제품의 인덱스를 찾습니다. 해당 제품이 존재하면 splice를 사용하여 목록에서 제거합니다. 다음으로 setProducts를 호출하고 새 제품 목록을 저장소에 저장합니다:

export async function deleteProduct(id) {
	let products = await localforage.getItem('products');
	let index = products.findIndex((product) => product.id === id);
	if (index > -1) {
		products.splice(index, 1);
		await setProducts(products);
		return true;
	}
	return false;
}

이전 강의 과제에서 생성한 애플리케이션을 사용하세요. 강의 자료를 참고하여 id를 기준으로 저장소에서 학생 데이터를 삭제하는 함수 deleteStudent를 작성하세요.