D
D
danilr2019-04-26 07:46:23
Vue.js
danilr, 2019-04-26 07:46:23

How to repeat this code in case of request error?

The request is sent to created() , then when the response is received in mounted() , it performs the necessary actions on a successful response - the question is, how can I repeat the request and do the same actions on a failed request? Tell me how to do it?

created(){
    this.dataRequest = this.getAllData()
  },
  mounted() {
    this.markers = DG.featureGroup();
    this.popups = DG.featureGroup();

    this.map = DG.map("map", {
      center: [54.98, 82.89],
      zoom: 9,
      minZoom: 7,
      zoomControl: false,
      fullscreenControl: false
    });
    
      this.dataRequest.then(response => {
        this.filter() // для планировок экшен
        this.setMarkers(this.residentials)
        
        this.map.on("zoomstart", this.onZoomStart);
        this.map.on("zoomend", this.onZoomEnd);
        
      })
      .catch(error => {
        console.log(error);
      });

  },

Answer the question

In order to leave comments, you need to log in

2 answer(s)
G
Gregory K., 2019-04-26
@danilr

Make a separate method like fetchData(). Call it on mounted.

fetchData() {
  this.dataRequest.then(response => {
        this.filter() // для планировок экшен
        this.setMarkers(this.residentials)
        this.map.on("zoomstart", this.onZoomStart);
        this.map.on("zoomend", this.onZoomEnd);
        
      })
      .catch(error => {
        this.fetchData();
      });
}

But in a good way:
1. Break it down into a larger number of methods, separating work with the map into a separate method from getting data
2. run fetchData in catch after timeout
3. In catch, it would be necessary to determine that the problem is the network, and not another: neither an error from the server, nor any on the client side. I don’t know what and how you send requests, so I can’t immediately offer a code.
On an older ES it will be a little prettier:
mounted() {
    this.markers = DG.featureGroup();
    this.popups = DG.featureGroup();

    this.map = DG.map("map", {
      center: [54.98, 82.89],
      zoom: 9,
      minZoom: 7,
      zoomControl: false,
      fullscreenControl: false
    });
    
    await fetchData();
    this.setMapMarkets();
  },
  methods: {
    setMapMarkers() {
        this.filter() // для планировок экшен
        this.setMarkers(this.residentials)
        this.map.on("zoomstart", this.onZoomStart);
        this.map.on("zoomend", this.onZoomEnd);
    },
   
    async fetchData() {
        try {
            const response = await this.dataRequest();
            // как-то надо использовать response, но у вас нет использования
        } catch (e) {
            // if ошибка сети
           await this.fetchData()
        }
    }
  }

E
Eugene, 2019-04-26
@e_snegirev

https://habr.com/ru/post/227225/
write or take from somewhere something like this

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question