第一次加载columnDetail页面，可以从store获取到column & posts，但刷新columnDetail页面store中的数据丢失

来源：7-7 使用vuex action 发送异步请求第二部分

慕勒0141251

2020-12-09

请教老师一个问题：
在第一次路由到columnDetail时，页面的数据（column&posts）可以正常显示，然后刷新浏览器地址栏的url时，columnDetail组件就没法从store里面获取数据，从log里面看到下面的代码返回的column／list为没有数据

const column = computed(() => store.getters.getColumnById(currId))
const list = computed(() => store.getters.getPostById(currId))

请问下老师，刷新地址栏会导致store里面的数据清空吗？
如果会清空的话: 我对比了下home组件中获取columns 和 columnDetail组件中获取column&posts的方式是类似的；为什么在home页面做同样的刷新操作，页面的数据能够正常显示呢?

写回答

1回答

张轩

2020-12-09

同学你好刷新这单独的页面的时候要发送一次单独的请求这个单独的 column 数据的，从首页过去，因为所有 column 数据是已经被加载的所以没有问题

onMounted(() => {
    store.dispatch('fetchColumn', currentId)
    store.dispatch('fetchPosts', { cid: currentId })
})

慕勒0141251

老师不好意思，小白一枚，没有太明白您说的。我昨天试着调试Home页面和 ColumnDetail页面，有个问题我不是很能理解。下面是我所进行的操作以及看到的现象： 1. 当从首页点击进入专栏页，onMounted钩子函数里面的请求数据会执行，能够获得column和posts的数据 2.进入专栏页后，刷新url，onMounted钩子函数＊不会＊执行，获取不到column&posts的数据，所以页面报错，专栏页的文章等显示不出来； 3.进入到Home页面后，页面数据能正常展示；刷新home页面的url后，Home.vue 里的onMounted钩子函数却＊会＊执行，所以页面能够获取到columns数据，并正常显示专栏列表；我的疑惑是：为什么在columnDetail页刷新url不会执行onMounted; 而在home页面刷新url却会执行onMounted呢？

2020-12-10

共1条回复

Vue3 + TS 仿知乎专栏企业级项目

带你完成前后端分离复杂项目，率先掌握 vue3 造轮子技能

3142 学习 · 2313 问题

查看课程

相似问题

文章详情页刷新后数据丢失

回答 1

第一次跳转页面数据加载不全，需要刷新一下才会全部加载

回答 1

首页专栏列表和专栏详情页的文章列表问题

回答 1

老师，我在最后npm run build的时候遇到几个ts错误不知道怎么改

回答 2

为什么老师把ajax请求写到store里面？

回答 1

打开慕课网App查看更多内容