How do I update my list after POST if im using a different endpoint?

ProgrammerZzzz123 0
Viewed 25

I need help with updating my list after POST. I can't see any answers online. Usually what I will just do is push object into array but I think in my case is different.

This function uses 2 api endpoint. The first api will get the list data. The weather api will base from the first api endpoint data, iterate through the list and get the data of the city that matches the name.

async getPreviousWeather() {
      let endpoint = "/api/";
      let promises = [];
      try {
        const response1 = await axios.get(endpoint);

        this.cities = response1.data;
        for (let i = 0; i < this.cities.length; i++) {
          const response2 = await axios.get(
            `https://api.openweathermap.org/data/2.5/weather?q=${this.cities[i].city_name}&units=metric&appid={API_KEY}`
          );
          this.infos.push(response2.data);
        }
      } catch (error) {
        console.log(error);
      }
    },

Now this endpoint post data from the first endpoint. The only problem that I have here is how to update the list on post. I don't know how to push it or i tried calling this.getPreviousWeather(); what happens is it adds the new data but also adds the previous ones.

async onSubmit() {
   

      let endpoint = "/api/";
      try {
        const response = await axios.post(endpoint, {
          city_name: this.city_query,
        });
        this.city_query = null;
        this.getPreviousWeather();
      } catch (error) {
        console.log(error);
      }
    },
    created() {
    this.getPreviousWeather();
  },
vue.js javascript
1 Answers

I created the answer I'm not sure if it is effective but it works.

methods: {
    async onSubmit() {
      let endpoint1 = `https://api.openweathermap.org/data/2.5/weather?q=${this.city_query}&units=metric&appid={API_KEY}`;
      let endpoint2 = "/api/";
      try {
        const response1 = await axios.get(endpoint1);
        const response2 = await axios.post(endpoint2, {
          city_name: this.city_query,
        });
        this.city_query = null;
        if (this.error) {
          this.error = null;
        }
        this.infos.push(response1.data);
      } catch (error) {
        console.log(error);
      }
    },
ProgrammerZzzz1230
Related