파이어베이스 DB에 있는 데이터를 삭제하는 기능은 처리하기가 Create보다 간단하다.
단, Create포스팅에서 파이어베이스 DB규칙을 관리자 중심으로 설정하지 않으면, 누구나 삭제할 수 있는 상태가 돼 버린다. '삭제'를 진행하기 전에 반드시 파이어베이스 DB규칙을 변경해야 된다는 점을 명심하자.(CRUD(1)포스팅에 있음)
1 Icon CDN
materialize 사이트에서 icon관련 cdn을 복사해서 index.html에 붙여주자.
아래와 같이 <head>사이에 CDN을 붙여넣는다.
2 Index.js변경
index.js의 setupPosts(data)함수에서, data가 있을 경우 delete아이콘이 생성될 수 있도록 <i>태그를 아래처럼 넣어준다.
3 delete이벤트 함수
삭제 이벤트 함수의 실제 코드는 간단하다. fs.collection(해당컬렉션).doc(id).delete();명령어를 실행하면, 해당 글(doc.id)이 삭제된다. 아래코드에서 e.stopPropagation()은 이벤트가 발생한 상태에서 다른 이벤트나 움직임을 강제로 멈추도록 하는 정지기능이며, e.target.parentElement.getAttribute('id')명령어를 통해서 firebase DB에 저장된 해당데이터의 id를 가져올 수 있다.
'코드 스터디' 카테고리의 다른 글
| 구글 파이어베이스 Storage(1) 프로필UI&사진 올리기 (2) | 2019.09.30 |
|---|---|
| 구글 파이어베이스 CRUD(3) Update 기능 (0) | 2019.09.28 |
| 구글 파이어베이스 CRUD (1) Create Post & 관리자 등록하기 (0) | 2019.09.26 |
| node.js에서 html기본 뼈대파일 만들기 (0) | 2019.09.25 |
| 「책소개 | 객체지향 사실과 오해」객체지향 설계 실전예시 (0) | 2019.08.30 |
댓글