老师我是用pinia完成的这一节的功能，但是每次页面刷新时navigationBar和它的横向滚动条会抖动一下

Question

源码附上，我尝试了持久化，问题未能解决，在这一节之前的代码中是不存在这个现象的，可能是什么原因导致的呢？

Answer 1

Sunday 2023-03-11 09:16:57

你好

我猜测这个抖动是因为《数据获取之后，navigatorBar 的宽度变化导致的》，可以尝试一下定宽看看能不能解决

• 提问者 CoderVi #1

  老师好，我找到了问题所在：动态校准rem导致每次刷新根元素的字体大小会改变，应该是咱们设定的这个大小比移动端默认的html元素的字体大小大一点，所以每次刷新文字会有从小变大的动画。目前我有几点疑惑，烦请老师耐心解答：1.我的动态校准rem和在main引用useREM和电子教案中的源码一致，为什么老师您课上展示的时候没有出现这个问题呢？2.useREM()在app.mount之前就被调用了，JS是单线程的，按理说代码从上往下执行，渲染的时候根元素字体大小已经改好了才对，为什么会在页面渲染了之后发生变化呢？3. 我顺着2思考，将app.mount放入一个延迟为0的setTimeOut中，问题得到了解决，这样做有什么副作用吗？有更好的解决方案吗？

• Sunday 回复 提问者 CoderVi #2

  rem 的校准工作应该在 DOM 渲染之前完成，也就是不应该出现第二次的 dom 渲染。所以你的前两个问题，需要确定的就是这一点。
  如果把 app.mount 放到 setTimeout 中，那么就意味着 vue 的渲染变成了一个异步线程，在当前的业务中，它并不会产生副作用，但却是不合理的

• 提问者 CoderVi 回复 Sunday #3

  谢谢老师，还有一个问题：我发现我刷新时汉堡按钮会闪烁一下，但完成后的项目是不会的，好像前面的课程没有提到这个问题的处理。

Answer 2

提问者 CoderVi 2023-03-10 21:59:53

录不了视频，大致上就是页面刷新后文字有一种整体从左上往右下移动到原先位置的抖动，其他功能都正常。

• 提问者 CoderVi #1

  补充：在pc端的navigationBar中不存在这个问题，刷新没有任何抖动。