Vue ページの更新またはバック パラメータの損失の問題を解決する
以下に、Vue ページの更新またはバック パラメータの損失の問題を解決する記事を紹介します。これは良い参考値であり、皆さんのお役に立てれば幸いです。
toB プロジェクトでは、アイテムの詳細ページを開いたり、リスト ページから一時的に離れてから戻ったりすると、選択したすべてのフィルタリング条件が失われることがよくあります。 . Xin せっかく選んだ条件が消えてしまって、ページングミスがあると、また次から次へと前に見たページに戻らなければいけないのが、ユーザーエクスペリエンスとしては非常に高いです。不親切な。
私には 2 つの解決策があります:
最初の方法: vue の
一定の結果を達成できますが、たとえば、プロジェクト内のすべてのページをキャッシュする必要はなく、コードの記述が複雑になります
2 番目の方法: localStorage を直接使用します。 、シンプルで粗雑です（推奨）
コードは次のとおりです:
list.vue
export default {
data () {
return {
searchForm:{
project_name:'',
status:'',
city:'',
round:'',
fund:'',
charge:'',
page: 1
},
},
beforeRouteLeave(to, from, next){
//打开详情页（或者下一个任意界面）之前，把筛选条件保存到localStorage，如果离开列表页并且打开的不是详情页则清除，也可以选择不清除
if (to.name == 'Detail') {
let condition = JSON.stringify(this.searchForm)
localStorage.setItem('condition', condition)
}else{
localStorage.removeItem('condition')
}
next()
},
created(){
//从localStorage中读取条件并赋值给查询表单
let condition = localStorage.getItem('condition')
if (condition != null) {
this.searchForm = JSON.parse(condition)
}
this.$http.get('http://example.com/api/test', {params: this.searchForm})
.then((response)=>{
console.log(response.data)
}).catch((error)=>{
console.log(error)
})
}
}
}
上記は、将来すべての人に役立つことを願ってまとめたものです。
関連記事:
jsによるModelAndView値の取得の問題についての簡単な説明
以上がVue ページの更新またはバック パラメータの損失の問題を解決するの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。
ホットAIツール
Undress AI Tool
脱衣画像を無料で
Undresser.AI Undress
リアルなヌード写真を作成する AI 搭載アプリ
AI Clothes Remover
写真から衣服を削除するオンライン AI ツール。
Clothoff.io
AI衣類リムーバー
Video Face Swap
完全無料の AI 顔交換ツールを使用して、あらゆるビデオの顔を簡単に交換できます。
人気の記事
ホットツール
メモ帳++7.3.1
使いやすく無料のコードエディター
SublimeText3 中国語版
中国語版、とても使いやすい
ゼンドスタジオ 13.0.1
強力な PHP 統合開発環境
ドリームウィーバー CS6
ビジュアル Web 開発ツール
SublimeText3 Mac版
神レベルのコード編集ソフト（SublimeText3）
iPhone で Web ページを更新する 6 つの方法
Feb 05, 2024 pm 02:00 PM
iPhone で Web を閲覧すると、ブラウザ アプリが開いている限り、読み込まれたコンテンツが一時的に保存されます。ただし、Web サイトはコンテンツを定期的に更新するため、古いデータを消去して最新の公開コンテンツを確認するには、ページを更新することが効果的な方法です。こうすることで、常に最新の情報と経験を得ることができます。 iPhone でページを更新したい場合は、次の投稿ですべての方法を説明します。 SafariでWebページを更新する方法【4つの方法】 iPhoneのSafariアプリで閲覧中のページを更新する方法はいくつかあります。方法 1: [更新] ボタンを使用する Safari で開いているページを更新する最も簡単な方法は、ブラウザのタブ バーにある [更新] オプションを使用することです。サファなら
Windows 11 で F5 更新キーが機能しない
Mar 14, 2024 pm 01:01 PM
Windows 11/10 PC では F5 キーが正しく機能しませんか? F5 キーは通常、デスクトップまたはエクスプローラーを更新したり、Web ページをリロードしたりするために使用されます。ただし、読者の中には、F5 キーがコンピュータを更新していて、正しく動作しないと報告している人もいます。 Windows 11 で F5 更新を有効にする方法は? Windows PC を更新するには、F5 キーを押すだけです。一部のラップトップまたはデスクトップでは、更新操作を完了するために Fn+F5 キーの組み合わせを押す必要がある場合があります。 F5 キーを押して更新しても機能しないのはなぜですか? F5 キーを押してもコンピューターを更新できない場合、または Windows 11/10 で問題が発生している場合は、ファンクション キーがロックされていることが原因である可能性があります。その他の考えられる原因には、キーボードまたは F5 キーが含まれます
Web ページをすばやく更新するにはどうすればよいですか?
Feb 18, 2024 pm 01:14 PM
ネットワークを日常的に使用する中でページの更新は頻繁に行われますが、Web ページにアクセスすると、Web ページが読み込まれない、表示が異常になるなどの問題が発生することがあります。現時点では、通常、問題を解決するためにページを更新することを選択しますが、ページを素早く更新するにはどうすればよいでしょうか?ページ更新のショートカット キーについて説明します。ページ更新ショートカットキーは、キーボード操作で現在のWebページを素早く更新する方法です。オペレーティング システムやブラウザが異なると、ページを更新するためのショートカット キーが異なる場合があります。以下では一般的な W を使用します。
反応ページが更新された後に値が消えた場合はどうすればよいですか?
Dec 29, 2022 am 11:11 AM
反応ページが更新された後に値が消える問題の解決策: 1. ページを更新し、状態内のデータがクリアされるかどうかを確認します。 2. 「const name = location.query.name; const id = location.query」を使用します。 .id;」メソッド ジャンプリンクにパラメータを追加することで、データを失うことなくパラメータを渡してページを更新できます。
キーボードの更新ショートカットキーとは何ですか?
Feb 25, 2024 pm 10:38 PM
キーボード更新ショートカット キーとは何ですか? コンピューター技術の発展に伴い、キーボードは私たちの日常の仕事や生活に欠かせないデバイスになりました。キーボードの機能は文字を入力するだけでなく、コンピュータのさまざまな機能を操作したり、作業効率を向上させるためによく使用されます。キーボード ショートカットを使用すると、さまざまな操作をより迅速かつ便利に完了できます。コンピューターを日常的に使用していると、ページを更新する必要がある状況によく遭遇します。 Webページを開いたり、ソフトウェアを実行したりすると、ページがフリーズしたり、読み込めなくなったりすることがありますが、その場合はページを更新してください。
ルーティングを使用して Vue プロジェクトでページの更新とキャッシュ制御を実装するにはどうすればよいですか?
Jul 22, 2023 am 11:13 AM
ルーティングを使用して Vue プロジェクトでページの更新とキャッシュ制御を実装するにはどうすればよいですか? Vue プロジェクト開発では、ルーティングを使用してページの更新とキャッシュ制御を実装することが非常に一般的な要件です。この記事では、ルーティングを使用して Vue プロジェクトでページ更新とキャッシュ制御を実装する方法を紹介し、対応するコード例を示します。ルーティング設定 まず、Vue プロジェクトでルーティング設定に vue-router を使用する必要があります。 vue-router は npm を通じてインストールでき、main.js に導入して設定できます。輸入する
win11で右クリックで更新する方法
Dec 28, 2023 pm 02:29 PM
更新は、コンピューターを使用するときによく実行される操作です。更新すると、インターフェイス、表示、アイコン、その他のプロパティの設定がすぐに表示されます。しかし、多くの友人は、win11 を使用している場合、右クリック メニューに更新がないことに気づきます。実際、これは、win11 メニューが追加されており、更新する前にメニューを入力する必要があるためです。 win11 での右クリック更新方法 1. win11 システムでは、右クリック メニューが変更され、空白スペースを右クリックしても更新を見つけることができなくなります。 2. 代わりに、右クリック メニューの下部にある "showmoreoptions" を見つける必要があります。 3. "showmoreoptions" を入力すると、[更新] が表示されます。 4. さらに、実際には右クリックを使用して更新する必要はありません。
win11システムで右クリックして設定を更新する方法
Dec 24, 2023 am 10:30 AM
Win11 システムをアップグレードした後、多くの友人が右クリックに更新ボタンがなく、使いにくいと感じています。そのため、今日は win11 システムの右クリック更新ボタンの設定方法をお届けします。一緒に操作方法を学びましょう。 win11 で右クリック更新を設定する方法: 1. まず、デスクトップの空白スペースを右クリックし、「showmoreoptions」をクリックします。 2. 開くとリストが表示され、その中に「更新」ボタンが表示されます。 3. ショートカット キー「win+r」を押して、run input regedit を開くこともできます。 4. レジストリを開き、「HKEY_LOCAL_MACHINE\SYSTEM\CurrentControlSet\Co」と入力します。
