Не могу разобраться как правильно доработаь код.
Проблемма в том что когда первый раз захожу на страничку, данные не загружаются, хотя в localStorage данные есть, Помогает только обновление странички через f5. Подскажите где я допустил ошибку, и как правильно офрмить код.
<template>
<div v-if="loading">Loading...</div>
<post-list :posts="posts"/>
</template>
<script>
import PostList from "./PostList";
import axios from 'axios';
export default {
name: "ContentSection",
components: {
PostList
},
mounted() {
this.loadPosts();
this.posts = JSON.parse(localStorage.data);
},
methods: {
loadPosts() {
axios.get('api/posts?page=' + this.page)
.then(res => {
localStorage.setItem('data', JSON.stringify(res.data.data));
this.posts = JSON.parse(localStorage.data);
this.loading = false;
})
}
},
data: () => ({
loading: true,
posts: [],
page: null
})
}
</script>
<style lang="sass" scoped>
</style>