[Vuejs]-Saving GET result in a text file ends up in infinite loop

by

0👍

Axios is a promise-base HTTP API, so removing the async/await will do

getStory(id) {
      return new Promise((res, rej) => {
          var req = 'http://localhost:8080/api/story/' + id
          axios.get(req).then((response) => {
              res(response.data.story);
           }).catch((err) => {
              rej(err);
           });
      })
    },
    getLetter() {
      var story = this.getStory(this.$route.params.id);
      this.story = letter;
    }

One more thing, there is loop so there is no infinite loop happening. Instead, the request is not finish.

0👍

I think you can try the following code below see

var app = new Vue({
  el: '#app',
 data () {
    return {
      story:"",
      url:"",
     
    }
  },
  created(){
	this.getLetter();
  },
  methods: {

        getStory:function(id) {
             var req = 'http://localhost/website-one-pages/slipt.php?id=' + id;
				 axios.get(req).then((response) => {
		              this.story = response.data;
		              
		              //set download
		              var data = [];
		              data.push(this.story);
		              var properties = {
			            type: 'text/plain'
			          };
			          try {
			            this.file = new File(data, "file.txt", properties);
			          } catch (e) {
			            this.file = new Blob(data, properties);
			          }
			          this.url = URL.createObjectURL(this.file);
			          //end set download

		           }).catch((error)=>{
                console.log(error);
              });
        },
        getLetter() {
          var id =2;//example id=2 
          this.getStory(id);
        },
    }
    
})
<div id="app">
    <p>{{story}}</p>
   
    <a id="link" v-bind:href="url" target="_blank" download="file.txt">Download</a>

Leave a comment