Vueはブール値でストレージを保存します今日、問題に遭遇しました。バックグラウンドから返された真偽の値をストレージに保存し、保存された値を使用して論理的な判断を行う必要がありました。しかし、判断は常に間違っていました。情報を確認した後、私は発見しました ローカルストレージにデータを保存する場合、保存されたブール値は、最初に保存されたブール値ではなく、文字列になります。 すべては文字列に変換されました それで、どうやって解決するのでしょうか? 1: フロントエンドで変換が実行されるlocalStorage.getItem('boolean') == 'true'の場合{ // 新しい値を再割り当てします 'ブール値' = true } あるいは保存するときにブール値を使って保存せず、代わりに数値や他の値を使ってから判断してください。 // 背景から返される値は true です (真)の場合{ localStorage.setItem('ブール値', 1) }それ以外 { ローカルストレージ.setItem('boolean', 2) } // 必要な場合 if (localStorage.getItem('Boolean value') == 1) { // イベントを処理する }else { // イベントを処理する} ローカルストレージにブール値を保存する際の落とし穴問題の説明最近、職場でいくつかの共有変数を保存するために localstorage を使用しましたが、ブール値を保存するときに多くの問題が発生しました。 一般的なアクセス方法は次のとおりです。 localstorage.setItem('key', value);//保存 localstorage.getItem('key');//取得 しかし、ブールデータを保存する場合、ローカルストレージに保存されたブールデータが文字列に変換されるため、「true」=true および「false」==false、「true」==false はすべて false として表示され、何度も試行しても問題が見つかりません。 最終解決策localstorage や sessionstorage にブール型データを格納する場合、取得されるデータは文字列 'true' 'false' になります。このタイプのデータを格納する場合は値を 0 または 1 に設定し、値を取得する場合は Number (localstorage.getItem('key')) を使用して、後続の判定操作を実行することをお勧めします。 具体的なコードは次のとおりです。 保存された値: チェックされている場合 //0: チェック済み localStorage.setItem("チェック済み",0); } それ以外 { //1: チェックなし localStorage.setItem("チェック済み",1); } 価値: getFlag:関数(){ var flag = Number (localStorage.getItem ('checked')); if(フラグ==0){ this.flag を true に設定します。 }そうでない場合(フラグ==1){ this.flag=false; } } 要約:localStorage と sessionStorage はどちらも文字列オブジェクトのみを保存でき、JS でよく使用される配列やオブジェクトを直接保存することはできません。 JSON オブジェクトが提供する parse メソッドと stringify メソッドを使用して、他のデータ型を文字列に変換し、ストレージに保存することができます。 コードは次のとおりです。 保存された値: localStorage.setItem("flag_data",JSON.stringify(flagData)); 価値: var flag_data = JSON.parse(localStorage.getItem("flag_data")); 上記は私の個人的な経験です。参考になれば幸いです。また、123WORDPRESS.COM を応援していただければ幸いです。 以下もご興味があるかもしれません:
|
>>: KVM 仮想マシンのオンライン ホット マイグレーションを実装する方法 (画像とテキスト)
最近、あるプロジェクトのクライアントが、上部に 2 つのタブ メニューを配置することを要求しました。...
MySQLデータベースのインストールに関するメモ、みんなで共有a) MySQL ソースインストールパ...
目次序文接続管理追加の接続管理ポート要約する序文皆さんの多くは、次のようなエラー メッセージに遭遇し...
CentOS 6 以前のバージョンでは、MySQL サーバー/クライアント インストール パッケージ...
目次1. MySQLインストールパッケージをダウンロードする2. MySQLのアンインストール手順3...
この記事の例では、円形のプログレスバーのドラッグアンドスライドを実現するための具体的なJSコードを紹...
Oracle、DB2、SQL Server などの他の大規模データベースと比較すると、MySQL に...
1. MySQLデータベースにログインするmysql -u ルート -pユーザーテーブルを表示する ...
序文この記事では、Vue コンポーネントがどのように解析され、レンダリングされるかを説明します。 V...
この記事では、WeChatアプレットでジグソーパズルゲームを実装するための具体的なコードを参考までに...
Web ページ制作では、input と img が同じ行に配置されることが多く、img タグが常に ...
1. Docker公式サイトにアクセスするまず、Dockerの公式ウェブサイトにアクセスして、最新の...
誰もがテーブルをよく知っているはずです。コード内でよく見かけます。テーブルにスラッシュ ヘッダーを追...
序文コストを考慮して、ほとんどのウェブマスターは、多数の小規模なウェブサイト用にサーバーを個別に購入...
1. MIME: 多目的インターネットメール拡張インペリアル カレッジ オブ コンピュータ オンラ...