알림 기능 만들기

          <div class="action-btn" id="btn1">
            <div class="action-ctrl">
              <button type="button" class="btnBlockProfile">차단하기</button>
              <button type="button" class="btnReportProfile">신고하기</button>
            </div>
          </div>

 

if (document.querySelector('.btnBlockProfile')) {
  const BlockProfileBtns = document.querySelectorAll('.btnBlockProfile');
  BlockProfileBtns.forEach(
    btn => {
      btn.addEventListener('click', () => handleBlockBtn());
    });
}

/**
   * 차단하기 버튼을 클릭하면 안내 메시지를 보여주고 최종 확인을 받으면 boolean 값을 반환
   * @returns 신고확인 버튼 클릭: true, 취소 버튼 클릭: false
   */
function handleBlockBtn() {
  if (confirm('정말로 차단하시겠습니까?')) {
    alert('차단이 완료되었습니다.')
    return true
  } else {
    return false
  }
}

알림 기능을 만들기 위해 만든 코드이다.

btnBlockProfile를 클릭 시 handBlockBtn 이벤트를 일으키고 클릭 시 confirm이 뛰운다 클릭 시

참은 true를 거절은 false를 리턴한다. true시 차단이 완료되었습니다란 문구와 함께 종료가 되고

아닐 시 false로 넘어가진다