0
const[update,setUpdate]=useState(false)
const[data,setData]=useState([])

При отправке новых значений на сервер , useEffect срабатывает дважды и делает два get запроса

        useEffect(()=>{
                const AjaxData = async () =>{
                    const reasponse = await fetch(url,{
                        method:'GET',


                    });
                    const reasponseJson = await reasponse.json();
                    console.log(reasponseJson);
                    setData(reasponseJson);
                }


                AjaxData();
  },[update])

Вот функция добавления

function addUser (body){
        fetch(url,{
            method:'PUT',
            body:JSON.stringify(body),
            headers: headers,
        }).then(()=>setUpdate(!update));  


    }

Как избежать второй отправки get запроса

3 ответа 3

2

useEffect срабатывает дважды: при первом рендере компонента и при изменении зависимости update. Если ты хочешь чтобы он срабатывал единожды, оставь список зависимостей пустым

0

В данном случае, как у вас -

  • повторный вызов срабатывает при изменении состояния update
  • если нужно, чтобы useEffect срабатывал только при состоянии update=false, то в начале useEffect напишите проверку

useEffect(()=>{
     if(update)return 
    //... AjaxData() 
    },[update])
0

Как вариант

let fix = true
useEffect(() => {
  fix = !fix
  if (fix) return
  console.log(123)
   // ...
   // ...
}, [update])
1
  • 1
    добро пожаловать на Stack Overflow на русском! пожалуйста, постарайтесь оставлять чуть более развёрнутые ответы. дополнить ответ можно, нажав править Commented 1 дек. 2022 в 12:29

Ваш ответ

Нажимая «Отправить ответ», вы соглашаетесь с условиями пользования и подтверждаете, что прочитали политику конфиденциальности.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.