fix: Исправлена навигация назад через useCallback

- Обернул nextStep, prevStep, updateFormData, handleSubmit в useCallback
- Теперь функции стабильны и не пересоздаются при ререндере
- nextStep и prevStep используют functional update для setState
- Добавлено логирование навигации: ' nextStep' и ' prevStep'
- Исправлены зависимости useMemo для steps

ПРОБЛЕМА: prevStep вызывался, но setCurrentStep не обновлял стейт
РЕШЕНИЕ: useCallback гарантирует что функции стабильны
This commit is contained in:
AI Assistant
2025-10-29 14:09:20 +03:00
parent d727b74d3c
commit 9f39847172

View File

@@ -1,4 +1,4 @@
import { useState, useMemo } from 'react';
import { useState, useMemo, useCallback } from 'react';
import { Steps, Card, message, Row, Col } from 'antd';
import Step1Policy from '../components/form/Step1Policy';
import Step2EventType from '../components/form/Step2EventType';
@@ -92,19 +92,27 @@ export default function ClaimForm() {
});
});
const updateFormData = (data: Partial<FormData>) => {
setFormData({ ...formData, ...data });
};
const updateFormData = useCallback((data: Partial<FormData>) => {
setFormData((prev) => ({ ...prev, ...data }));
}, []);
const nextStep = () => {
setCurrentStep(currentStep + 1);
};
const nextStep = useCallback(() => {
console.log('⏩ nextStep called');
setCurrentStep((prev) => {
console.log('📍 Current step:', prev, '→ Next:', prev + 1);
return prev + 1;
});
}, []);
const prevStep = () => {
setCurrentStep(currentStep - 1);
};
const prevStep = useCallback(() => {
console.log('⏪ prevStep called');
setCurrentStep((prev) => {
console.log('📍 Current step:', prev, '→ Prev:', prev - 1);
return prev - 1;
});
}, []);
const handleSubmit = async () => {
const handleSubmit = useCallback(async () => {
try {
addDebugEvent('form', 'info', '📤 Отправка заявки на сервер');
@@ -151,7 +159,7 @@ export default function ClaimForm() {
addDebugEvent('form', 'error', '❌ Ошибка соединения');
console.error(error);
}
};
}, [formData, claimId, sessionId, addDebugEvent]);
// Динамически генерируем шаги на основе выбранного eventType
const steps = useMemo(() => {
@@ -226,7 +234,7 @@ export default function ClaimForm() {
});
return stepsArray;
}, [formData, documentConfigs, isPhoneVerified]);
}, [formData, documentConfigs, isPhoneVerified, claimId, sessionId, nextStep, prevStep, updateFormData, handleSubmit, setIsPhoneVerified, addDebugEvent]);
const handleReset = () => {
setFormData({