別のイベントで、同じタイプの配列に複数の文字列をローカルストレージに追加する方法

Question

NodeJs、ExpressJS、Ajax、およびMongo/Mongoose DBで構築されたショッピングカートアプリケーションで作業しています。ユーザーが特定の商品のカートに追加ボタンをクリックすると、その商品の特定の商品IDをボタンから取得しています。その後、Ajaxリクエストをサーバーに送信して、その製品に関するすべての情報を取得し、フロントエンドに送信してローカルストレージに格納します。その製品のすべての情報のデータが返されたら、それを文字列にしてカートに追加された他の製品の配列に追加し、ローカルストレージに格納する必要があります。問題は、取り出されたデータを配列に取得し、同じキーの下にある複数の製品を異なる時間にローカルストレージに格納することです。これは、カートに製品の数を追加した後、このような何かを返す終わる

var anotherCart = (localStorage.getItem('Product')); // getting what is already in local storage var cart = []; // creating an empty array cart.push(anotherCart); //adding what is already in local storage to the empty array var addCart = responseArr[1]; //retrieving json data from the database. This is getting all of the needed product information to add to the local storage cart.push(addCart); //adding the new product item to the cart array. There now should be what is already in the local storage and the newly added product localStorage.setItem('Product', JSON.stringify(cart)); //stringifying and adding the cart array to local storage

：：私がやっている何

はこれです

Array[2] 0 : "["[\"[\\\"[null,\\\\\\\"{ _id: 583df3eead025434e61a2172,\\\\\\\\n filePath: '/public/images/df54528a827f99586135956e45f045fe.jpg',\\\\\\\\n addProductGroupName: 'Xbox One',\\\\\\\\n productName: 'Far Cry',\\\\\\\\n productPrice: 78.34,\\\\\\\\n productDescription: 'Its back again. I have never played this game but heard it is pretty good. Wanted to write an extra long description to see if someone really took the time to type such a longer sentence how exactly it would appear on things throughout the application.',\\\\\\\\n productId: 'rJUg4uiGl' }\\\\\\\"]\\\",\\\"{ _id: 583df3eead025434e61a2172,\\\\n filePath: '/public/images/df54528a827f99586135956e45f045fe.jpg',\\\\n addProductGroupName: 'Xbox One',\\\\n productName: 'Far Cry',\\\\n productPrice: 78.34,\\\\n productDescription: 'Its back again. I have never played this game but heard it is pretty good. Wanted to write an extra long description to see if someone really took the time to type such a longer sentence how exactly it would appear on things throughout the application.',\\\\n productId: 'rJUg4uiGl' }\\\"]\",\"{ _id: 583df420ad025434e61a2173,\\n filePath: '/public/images/e6f5cab3de92a9365807cb8301f781b7.jpg',\\n addProductGroupName: 'Xbox One',\\n productName: 'Star Wars BattleFront',\\n productPrice: 3000,\\n productDescription: 'This games is like, a game, for star wars',\\n productId: 'BJ_7VOiGg' }\"]","{ _id: 583df3eead025434e61a2172,\n filePath: '/public/images/df54528a827f99586135956e45f045fe.jpg',\n addProductGroupName: 'Xbox One',\n productName: 'Far Cry',\n productPrice: 78.34,\n productDescription: 'Its back again. I have never played this game but heard it is pretty good. Wanted to write an extra long description to see if someone really took the time to type such a longer sentence how exactly it would appear on things throughout the application.',\n productId: 'rJUg4uiGl' }"]" 1 : "{ _id: 583df420ad025434e61a2173,↵ filePath: '/public/images/e6f5cab3de92a9365807cb8301f781b7.jpg',↵ addProductGroupName: 'Xbox One',↵ productName: 'Star Wars BattleFront',↵ productPrice: 3000,↵ productDescription: 'This games is like, a game, for star wars',↵ productId: 'BJ_7VOiGg' }" length : 2 __proto__ : Array[0]

ので、2つがありますここで大きな問題が起こっています。まず、配列に商品を追加すると、配列内の最初のオブジェクトにすべて追加されます。第2に、配列に返される最初のものはnullです。これは、初めてローカル記憶域に何もないためです。

だから、これらのアイテムをアレイに追加してローカルストレージに保存する方法については、誰でも助けてくれますか？私の多くの試みはすべて失敗であった。また、複数の製品をローカルストレージに別々の時間に格納するという一般的な考え方を解決するための優れたソリューションを誰かが提供して、追加した後すぐにアクセスすることもできます。

助けてください。ありがとうございました。

Answer 1

まず、Productはオブジェクト（おそらく文字列）です。

私はあなたが注文が混ざっていると思います。あなたは、一般的に、あなたがそれを行うために必要なものをやったまでのデータ列にする必要はありません：

 

    var products = localStorage.getItem("products") || "[]";// this should be an array 
    products = JSON.parse(products); 
    var product = {id:1,filePath:"path",etc:"yaddayadda"};// from api 
    products.push(product); 
    localStorage.setItem("products",JSON.stringify(products)); 

すなわち希望このことができます（「[]」であることに注意してください文字列 - JSON.parse(value)はvalueが文字列になると予想しています）