2017-07-03 16 views
1

Firebaseデータベースから要素を削除すると問題が発生します。 (ちょうどサンプル)を、以下のような構造がある:Firebaseは、削除後に未定義オブジェクトの配列を返します

firebase.database().ref("https://stackoverflow.com/users/").on("value", snap => { 
    users = snap.val(); 
    console.log(users); // pay attention to this line 
    usersLoop(); 
}); 

その後、私は、画面上の要素をレンダリングし、私は削除しよう:

{ 
    "users": 
    [ 
    { 
     "id": 0, 
     "name": "Toma Broome" 
    }, 
    { 
     "id": 1, 
     "name": "Boyd Bolens" 
    } 
    ] 
} 

私は、ユーザーが接続がこのようなものですリスト取得していますいずれか

firebase.database().ref(`/users/${targetEl}`).remove(); 

IはFirebaseコンソールをチェックするが、ユーザアレイundefined値といくつかの要素を削除した後、それはリターンが含まれている場合に要素が実際にデータベースから削除されますオブジェクトであり、配列ではありません。

これは、データベースの最初の位置にある3つの要素を削除した後のコンソールです。つまり、JSONファイルを使用してアップロードしているユーザーの全リストを取得し、最初の要素を削除し、他のすべての要素をDOMで再レンダリングします。その後、私は再び最初の要素を削除し、最終的に私は三度目の最初の要素を削除すると、コードが配列あなたが見ることができるようにまた

(5) [undefined × 1, Object, Object, Object, Object] 
(5) [undefined × 2, Object, Object, Object] 
Object {3: Object, 4: Object} 

を期待しているので、私はfirebaseと明らかに何も描画されていないからオブジェクトを取得しますデータベース内に要素が少なくなると、配列の長さは5に戻ります。

私が考えているオプションは、返されたコレクションから未定義の要素を削除したり、それを配列に変えたりすることですが、未来を見据えたアプリケーションのスケーラビリティオプションを無視します。

最後に、何かよりも奇妙に思えるのは、視覚的に正確に見えるときに突然データベース構造が変化するように見えるということです。

これはfirebase

-users 
|-0 
    |-id:0 
    |-name:value 
    |-otherprops:value 
|-1 
    |-id:1 
    |-name:value 
    |-otherprops:value 
+2

Firebaseは配列を格納も返しません:https://firebase.googleblog.com/2014/04/best-practices-arrays-in-firebase.html – cartant

+1

@cartant Firebaseが配列を格納していないのは間違いですが多くの場合、格納された値の配列は配列のように見えます。しかし、アイテムを削除すると、それが失われます。実際、この質問のケースは、ブログ記事の「a、b、dを削除すると、スニペットではっきりとカバーされています。 –

+1

誰かが "配列のように見える"ことに興味があるなら、[source](https://github.com/firebase/firebase-js-sdk/blob/v4.1.3/src/database)を見てください。 /js-client/core/snap/ChildrenNode.js#L203-L210)。 – cartant

答えて

2

上のデータベースの構造である@cartantから提供されたリンクは、答えを与えました。

はい、firebaseはそのデータ内の配列構造を許容しますが、特定のデータがあまりにも多すぎたり、全く変更されない場合を除き、使用することはお勧めしません。私の場合(いくつかの種類のCRUDアプリケーションを作成すること)はお勧めできません。オブジェクトを使用するだけでOKです。つまり、配列を持つjsonファイルをアップロードすると、firebaseは配列の各要素のキーとして整数を使用してオブジェクト構造に変換します。それから私は、要素を削除するために開始し、この時点に達したとき:最終的には全体の問題を作成firebase返すオブジェクトにその結果が、要素の特定の数のステートメントのコード、他に渡された部分を削除した後

if (!opt_exportFormat && allIntegerKeys && maxKey < 2 * numKeys) { 
    // convert to array. 
    var array = []; 
    for (var key in obj) 
    array[key] = obj[key]; 

    return array; 
} else { 
    if (opt_exportFormat && !this.getPriority().isEmpty()) { 
    obj['.priority'] = this.getPriority().val(); 
    } 
    return obj; 
} 

を。

私はこのタイプの構造になってしまった:私は、データを取得することができた

{ 
    "users": 
    { 
    "user_00": { 
     "id": 0, 
     "name": "Toma Broome" 
    }, 
    "user_01": { 
     "id": 1, 
     "name": "Boyd Bolens" 
    } 
    } 
} 

そして(またはそれがループ内のためすることができる)オブジェクトをループしlodashを使用して私は配列を使うときと同じようにしていました。最後にオブジェクト構造を使用して、定義されていない要素を持つコレクションはこれ以上なくなりました。

@cartant、ありがとうございました!!!私は間違いなくあなたのコメントで何かを学ぶ。私はあなたが答えを投稿できるようにして、問題の解決策としてマークし、それをアップアップすることを願っています。

+0

できるときは、あなた自身の答えを受け入れてください。状況をよく説明している。私はリンクがいくつかの助けになってうれしいです。 – cartant

関連する問題