VueJS axios는 버튼을 한 번만 클릭할 수 있으며 데이터 수신 후 두 번째 클릭을 허용합니다.

Question

저는 Laravel/VueJS에서 좋아요/싫어요 시스템을 작업하고 있습니다.

내 시스템은 작동하지만 스팸 발송자를 피하고 싶습니다.

좋아요 버튼:

으아악

10은 게시물 ID이며 laravel Blade에서 생성됩니다...

스패머를 피하는 방법은 다음과 같습니다.

으아악

하지만 여기서 뭔가 빠졌거나 내가 뭔가 잘못하고 있는 것 같아요. 유사한 아이콘을 매우 ​​빠르게 클릭하고 요청을 확인하면 axios는 3-4-5 요청을 보냅니다(클릭 속도에 따라 다름)

3~5번 요청한 후에만 data.allowed 才会变成 false. 왜? 내가 원하는 것:

1. 허용 = 사실
2. 사용자 클릭 -> 허용됨 = false; 두 번째 클릭 "이전 알림이 종료되지 않았기 때문에 다시 클릭할 수 없습니다.";
마지막 알림 끝 -> 허용됨 = true;
...루프

Answer 1

this.allowed = false； API 호출이 완료될 때까지 호출되므로 이 시간 동안 더 많은 스팸을 보낼 수 있습니다. 확인if(this.allowed)后立即将其设置为false.

으아아아

Answer 2

으아아아