私のVuejsアプリをFirebaseに接続できません

Question

私はこれをしばらくの間行ってきました。チュートリアルを読んで、みんなが違うことをしているので、運がない。

私はVueアプリケーションをFirebaseバックエンドに接続しようとしています。

<script> 
import firebase from 'firebase' 

export default { 
    name: 'staff-list', 

    data() { 
    return { 
     firebase.database().ref('employees').on('value').then((data) => { 
     office.push(data); 
     }).catch(
     (error) => { 
      console.log(error); 
     } 
    ), 
     // This will pull in the data from Firebase. 
     office: [] 
    } 
    } 
} 
</script> 

私はエラーになっています：

Module build failed: SyntaxError: Unexpected token, expected , (30:14) 

    28 | data() { 
    29 |  return { 
> 30 |  firebase.database().ref('employees').on('value').then((data) => { 
    |    ^
    31 |   office.push(data); 
    32 |  }).catch(
    33 |   (error) => { 

私はまた私のMain.jsファイルにfirebaseを初期化してきたが

私は、スクリプトを持っているStaff.vueと呼ばれるコンポーネントを持っています：

const config = { 
    apiKey: "foo", 
    authDomain: "bar", 
    databaseURL: "foobar", 
    projectId: "barfoo", 
    storageBucket: "foobarfoo", 
    messagingSenderId: "blarg" 
}; 

firebase.initializeApp(config); 

なぜ動作しないのかわかりません。誰かがこの問題を抱えていて、なぜこれが助けになったのかを知ることができました。

ありがとうございます。

Answer 1

返されたオブジェクト定義のコードを間違って実行しようとしています。

はdata法対象外というfirebaseコールを引き、（this.office経由office配列を参照）createdライフサイクルフックでそれを呼び出す：

data() { 
    return { 
    office: [] 
    } 
}, 
created() { 
    firebase.database().ref('employees').on('value').then((data) => { 
    this.office.push(data); 
    }).catch((error) => { 
    console.log(error); 
    }); 
} 

は、フックのいずれかで、あなたの `firebase'`initializationを移動