Reputation: 21
import axios from 'axios'
export default {
name: 'FileList',
props: {
},
data () {
return {
pageSize: 10,
offset: 0,
model: "",
rows: []
}
},
mounted() {
this.search();
},
computed: {
},
methods:{
search: function(){
var url = 'http://myurl'
var options = { headers: {
'Authorization': localStorage.getItem("authToken")
}}
axios.get(url, options).then( (response) => {
console.log('BEFORE:',this.rows)
this.rows= response.data;
console.log('AFTER:',this.rows)
})
}
This function is not working even after finding this post: Axios can't set data and applying the solution. But this is what is being printed after loading the component:
As you can see the post has the same problem as me.
Please, help me as i am getting desperate.
EDIT: After removing the setTimeout function since it didn help anything, i have included the render part. Since it is where i see the problem.
<div v-if="rows.length =! 0" class="row" v-for="row in rows" style="margin-top: 30px">
<div class="col-6 offset-3">
<div class="card text-left">
<div class="card-body">
<h5 class="card-title"><b>ModelID: {{row.modelID}}</b> </h5>
<h6 class="card-subtitle mb-2 text-muted"><b>File Name: </b>{{row.fileName}}</h6>
<h6 class="card-subtitle mb-2 text-muted"><b>Autor:</b> {{row.author}}</h6>
<h6 class="card-subtitle mb-2 text-muted"><b>Created:</b> {{row.createdAt}}</h6>
<h6 class="card-subtitle mb-2 text-muted"><b>Updated:</b> {{row.updatedAt}}</h6>
<h6 class="card-subtitle mb-2 text-muted"><b>Name:</b> {{row.name}}</h6>
<h6 class="card-subtitle mb-2 text-muted"><b>ID:</b> {{row.id}}</h6>
<h6 class="card-subtitle mb-2 text-muted"><b>Hash:</b> {{row.hash}}</h6>
<a href="#" class="card-link">Descargar</a>
</div>
</div>
</div>
</div>
Upvotes: 0
Views: 1270
Reputation: 21
The problem was with the v-if condition, is an assignation, not a negative conditional.
rows.length =! 0
Should have been
rows.length != 0
Upvotes: 1