Xóa dữ liệu khỏi bộ nhớ trong React Router

Ứng dụng của chúng ta đã có thể thêm mới sản phẩm, chỉnh sửa dữ liệu, việc còn lại chỉ là thêm chức năng xóa dữ liệu. Để làm điều này, chúng ta sẽ lại đi qua các bước quen thuộc từ các bài học trước.

Đầu tiên, hãy mở tệp forStorage.js và thêm hàm cuối cùng để xóa một sản phẩm cụ thể deleteProduct dựa trên id của nó:

export async function deleteProduct(id) {}

Sau đó, chúng ta sẽ lấy danh sách sản phẩm từ bộ nhớ và tìm chỉ mục của sản phẩm muốn xóa. Nếu sản phẩm đó tồn tại, chúng ta sẽ xóa nó khỏi danh sách bằng splice. Tiếp theo, chúng ta sẽ gọi setProducts và ghi danh sách sản phẩm mới vào bộ nhớ:

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;
}

Hãy sử dụng ứng dụng bạn đã tạo trong các nhiệm vụ của các bài học trước. Sử dụng tài liệu bài học, hãy viết hàm deleteStudent để xóa dữ liệu sinh viên khỏi bộ nhớ dựa trên id.