After attempting to save a String obtained from a GET request into a text file, I encountered an unexpected infinite loop issue. It seems that without utilizing created(), the process fails entirely, resulting in story remaining empty.
<div id="app">
<p>{{story}}</p>
<a id="link" v-bind:href="url" target="_blank" download="file.txt">Download</a>
</div>
<script>
var str = {
data: function () {
return {
story: '',
file: null,
}
},
methods: {
async getStory(id) {
var req = 'http://localhost:8080/api/story/' + id
try {
const response = await axios.get(req);
return response.data.story;
} catch (error) {
console.error(error)
}
return false;
},
async getLetter() {
var letter = await this.getStory(this.$route.params.id);
this.story = letter;
},
textFile() {
var data = [];
console.log(this.story);
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);
}
},
created() {
this.getLetter();
},
updated() {
this.textFile();
}
}
</script>
Is it advisable to leverage the HTML5 function for saving files?