как передать параметр из useEffect

#node.js #reactjs #axios #react-hooks

Вопрос:

Я борюсь с передачей параметра из useEffect. В методе POST, показанном ниже, генерируется идентификатор (res.data._id), но я не знаю, как я могу передать его следующему методу, используемому позже

     useEffect(() => {
        axios
            .post('/api/hist', {
                user,
                collId: `${id}`,
                answers
            })
            .then((res) => {
                console.log('id:', res.data._id)

            });
    }, []);
 

при каждом нажатии на кнопку используется другой метод

     const saveAnswer = (answer: string, isCorrect?: boolean) => async () => {
 

        axios
            .post('/api/answer', {
                isCorrect: isCorrect,
                flashcardId: answer
            })
            .then((res) => {
                console.log(res.data)
 
                });
    };
 

но здесь я хотел бы использовать этот идентификатор, сгенерированный ранее, как histID
:

             .post('/api/answer', {
                isCorrect: isCorrect,
                flashcardId: answer,
                histID: ???

            })
 

кто-нибудь знает, как этого добиться?

Комментарии:

1. Где id объявлена переменная и сгенерировано значение для начала? Нельзя ли его снова использовать в других функциях?

Ответ №1:

Я не уверен, что понимаю, чего ты хочешь, но я пытаюсь тебе помочь.

 import React,{useState,useEffect} from 'react'

 const App = () => {
 /**
 * I don't know where is your
 *  - user
 *  - answers
 *  - id
 */
 const [histID,setHistID] = useState(null);

 const getHistID = async () => {
  try {
   const {data} = await axios.post('/api/hist',{
     user,
     collId: `${id}`,
     answers
   })
   if(data){
     setHistID(data.id)
   }
  } catch (error) {
   console.log('getHistID', error);
  }
 };

 useEffect(() => {
  getHistID();
 },[])

 const saveAnswer = async (answer: string, isCorrect?: boolean) => {
  try {
   const {data} = await axios.post('/api/answer',{
     isCorrect: isCorrect,
     flashcardId: answer,
     histID,
   })
   console.log(data);
  } catch (error) {
   console.log('saveAnswer', error);
  }
 }

 return (
   // your render
 )
}

export default App