Как получить данные несколько раз в React

Я работаю над приложением полного стека, в frontend я использую react, а для Backend я использую Django.... Я хочу сделать так, чтобы при входе пользователя в систему автоматически отображались все посты пользователей, за которыми он следит, У меня есть три модели, Post, User, Following Сначала я должен получить данные, чтобы получить идентификаторы всех последователей, а затем я должен получить данные снова, чтобы получить все сообщения, которые связаны с последователями, Я пытался сделать это: Home.js

const [following,setFollowing]=useState([]);
const getFollowing = async()=>{
  if(authToken){
  console.log("TOKEN : ",authToken.access);
 try{
  let response= await fetch(`${BASE_URL}profile/following/`,{
    method:"GET",
    headers:{
     
      "Content-Type":"application/json",
      "Authorization":`Bearer ${authToken.access}`,
    
    }
  })
let data= await response.json()
setFollowing(data)
}catch(error){
  console.log(error);
 }
}
//for getting posts 
const getPost= async (num)=>{
      let response= await fetch(`${BASE_URL}post/${num}`,{
        method:"GET",
        headers:{
        "Authorization":`Bearer ${authToken.access}`,
        "Content-Type":"application/json"
      },
      })
      let data= await response.json()
      console.log("Fetched Posts : ", data);
    }

//loop to fetch all posts 
const getAllPosts=()=>{
  let  values=Object.values(following)
  values.map(value=>(
   posts.push(value[Object.keys(value)[0]])
  ))
  var arrayLength=posts.length-1
  while(arrayLength=>0){
  getPost(posts[arrayLength])
  arrayLength-=1 }}

Я не понимаю, как получить данные несколько раз, например, если у меня есть следующие id's=[4,3] , как отправить их в метод getPost

Чтобы получить сообщения от нескольких пользователей, за которыми следит текущий пользователь, вы можете модифицировать свой код, чтобы просмотреть список идентификаторов следующих пользователей и получить сообщения для каждого из них. Вот как можно модифицировать обе функции:

const getAllPosts = async () => {
  try {
    // Check if following is defined and not empty
    if (following && following.length > 0) {
      // Loop through each following ID
      for (let i = 0; i < following.length; i++) {
        const followingId = following[i];
        // Fetch posts for the current following ID
        await getPost(followingId);
      }
    } else {
      console.log("No following users found.");
    }
  } catch (error) {
    console.log(error);
  }
};

const getPost = async (userId) => {
  try {
    let response = await fetch(`${BASE_URL}post/?user=${userId}`, {
      method: "GET",
      headers: {
        "Authorization": `Bearer ${authToken.access}`,
        "Content-Type": "application/json"
      },
    });
    let data = await response.json();
    console.log("Fetched Posts for user ", userId, " : ", data);
  } catch (error) {
    console.log(error);
  }
};

Возьмите массив следующих идентификаторов, сопоставьте их с массивом Promises и await все их разрешите.

Пример: 

const getPost = async (userId) => {
  try {
    const response = await fetch(`${BASE_URL}post/?user=${userId}`, {
      method: "GET",
      headers: {
        "Authorization": `Bearer ${authToken.access}`,
        "Content-Type": "application/json"
      },
    });
    const data = await response.json();

    console.log("Fetched Posts for user ", userId, " : ", data);

    return data; // <-- return fetched post data
  } catch (error) {
    console.log(error);
  }
};

const getAllPosts = async () => {
  try {
    // Assumes the following state is just the array of post ids
    const posts = await Promise.all(following.map(getPost));

    // do with the posts array of responses what you need to do
  } catch(error) {
    // catch/handle any thrown errors or Promise rejections
  }
};
Вернуться на верх