以下に、vue ページをスクロールページ表示の最上部に切り替える例を紹介します。これは良い参考値であり、皆さんの役に立つことを願っています。
mint UIを使用して携帯端末の「リストビュー」から詳細ページにジャンプするように記述すると、詳細ページは携帯電話の高さよりも大きいため、「リストビュー」をクリックしてリストをスクロールすると、スクロールできます。詳細ページに入ると、上から詳細ページが表示されないことがわかります。
1. 目標:
「listview」 詳細ページに入ると、ページ上部から詳細ページが表示されます。
2番目に、最初に次の2つのページのscrollYを確認します。それらは毎回異なり、リストビューと詳細ページの間のscrollYの間にパターンはありません
解決策のアイデアは3つあります。 詳細ページに入ると、スクロールするページの位置が上部に固定されます
4. コード実装: vue は次のように記述されます 更新されたライフサイクルについては
updated() { window.scroll(0, 0); }
5. の問題は解決されましたが、ネットワークが遅い場合、ページの下から上にスクロールするプロセスがあまり美しくないことがわかります。この問題については、マスクを追加できます。 6.
ログイン ページからメイン ページに入る Vue のインターセプターを作成する方法を共有します(1) ログイン時に sessionStorage に保存します。 .vue ログインは成功しました
sessionStorage.setItem('isLogin', true)
(2) Router で、index.js に
router.beforeEach((to, from, next) => {// '/'是登陆页面的路由 if (to.path == '/') { sessionStorage.removeItem('isLogin'); } let user = JSON.parse(sessionStorage.getItem('isLogin')); if (!user && to.path != '/') { next({ path: '/' }) } else { next() } })
VueページのDOM操作が反映されない問題を解決
以上がvue ページがスクロール ページに切り替わり、先頭の example_vue.js が表示されますの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。