Vue ルーティング変更ページのデータが更新されない問題を解決する

ここで、Vue のルーティング変更ページのデータが更新されない問題を解決する記事を共有します。これは良い参考値であり、皆様のお役に立てれば幸いです。

私は毎日少しずつ記録し、私と同じ問題に遭遇したより多くの人に役立つことを願っています。

問題の説明: インターフェースを調整することで、ヘルプページの質問リストが複数のレベルで表示され、クリックした質問に次のレベルの質問がない場合、コンテンツページにジャンプします。

問題は、パソコンでモバイルページを作成しているときに、次々と詳細ページに飛んでしまい、戻りたくて

ボタンをクリックすると、上の最初の画像に直接ジャンプしてしまうことです。いやいや、これは私が望む結果ではありません。現時点では、URL を変更してページの階層を変更することを考えています。

最初のレベルの親は0で、表示されないか、デフォルトで表示されます。

第 2 レベルの親は 1 です。第 1 レベルのルートをクリックすると、次の図に変わります:

クリックして次のレベルのページに入ると、データが更新されますが、コンピューターをクリックして戻ると、 URL の最後の親が 1 になり、ページはまだ存在します。 2 のデータを表示すると、

の解決策は次のようになります:

created () {
 console.log(this.getStatus(this.$route.path))
},
 watch: {
 '$route' (to, from) {
  console.log(this.getStatus(this.$route.path))
 }
 },
 methods: {
 getStatus (urlStr) {
  var urlStrArr = urlStr.split('/')
  return urlStrArr[urlStrArr.length - 1]
 }
},

上記は、私が皆さんのためにまとめたものです。将来すべての人に役立ちます。

関連記事:

Vueプロジェクトにアイコンを導入する方法

JavaScriptでのメールアドレス形式の検証

JavaScriptのパフォーマンス最適化のためのタイムシェアリング関数の紹介

以上がVue ルーティング変更ページのデータが更新されない問題を解決するの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。