Question

我正在尝试将此功能用于Firebase托管。它正在检索数据并将其记录到控制台，但是vue似乎没有显示用户名：

  <script>
    var config = {
        apiKey: "Long Key",
        authDomain: "myUrl.firebaseapp.com",
        databaseURL: "https://myUrl.firebaseio.com",
        projectId: "myUrl",
        storageBucket: "myUrl.appspot.com",
        messagingSenderId: "12345"
    };
    var app = firebase.initializeApp(config);
    db = firebase.firestore(app);
  </script>
</head>
<body>
  <div id="app">
    <p>Username: {{user.username}}</p>
  </div>
<script src="https://unpkg.com/vue"></script>
<script>
var user = db.collection("users").doc("chordscribble").get().then(function(doc){
  console.log(doc.data()); 
});
console.log(user); //logs {username:"admin"}
var vm = new Vue({
  el: '#app',
  data: {
    "user":user
  }  
});
</script>

将数据从firestore获取到vue的数据对象的正确方法是什么？另外，无论如何只是查询并返回字符串“admin”而不是整个对象？例如，我试过：

   db.collection("users").doc("chordscribble").get().then(function(doc){
      console.log(doc.data("username")); 
    });
    console.log(user); // hoping for "admin"
...and tried:

   db.collection("users").doc("chordscribble").get().then(function(doc){
      console.log(doc.data().username); 
    });
    console.log(user);  //hoping for "admin"

从Firestore到Vue.js应用程序的数据对象的数据

0 个答案: