next第一次初始化页面请求的数据为空解决办法

开发next的过程中又遇到这样的一个问题：浏览器头一次打开next项目的某一个页面，该页面需要请求后端的数据，然而在请求到接口数据之前getInitialProps方法已经return出结果导致页面没有接口数据。当多次打开页面后就不会有这种情况。
分析可能的原因:
1.浏览器存在缓存，直接使用缓存的页面数据。
2.项目的数据接口太深，需要在每个循环中请求数据
3.重新刷新浏览器页面就正常
代码问题分析: 
1.在getInitialProps逻辑中我是有使用async和await因此可以保证接口是有请求的
2.每个循环的请求结果我会加到相应的这个对象的新建字段中

test.getInitialProps = async (res) => {
  const { fnavlist, options, links } = await init()
  const id = res.req ? hrefObj(res.req.url).id : res.query.id
  const navBar = await fnavlist.filter(item => item.name.includes('支持'))[0].children.filter(item => item.name.includes('下载'))[0]
  await navBar.children.map(async items => {
    await items.children.map(async item => {
      let { data } = await getPageContent(item.id, 1, 20)
      item.con = await data.ArticlePage.Articles
      return item
    })
    return items
  })

  return {
    fnavlist,
    options,
    links, navBar,
    current: navBar.children.filter(item => item.id == id)[0],
    list: navBar.children.filter(item => item.id == id)[0].children
  }
};

解决：
当页面中没有关键的数据的时候刷新页面。（个人感觉这不是最优解决办法后续会继续深入研究）

useEffect(() => {
    if (!props.list[0].con) {//切换tab没有数据bug重新刷新页面
      window.location.href = window.location.href
    }
  })