1

Vue.js 对 sql 程序员来说是一种生活方式的改变，但要做到这一点。在这里，我按照规范使用 vuefire，甚至从我的一条记录中手动插入正确的密钥，一个字段 Firebase DB 来测试它。然而，没有看到任何返回或显示。

很想知道怎么做！并填写我的单值表。从那里我敢肯定，天空是极限。谢谢你的帮助。

错误消息：vue.common.js?e881:481 [Vue 警告]：挂载钩子错误：“ReferenceError：未定义居民数组”

 <template>

    <div class="edit">

    <div class="container">
      <p style="margin-bottom:10px;font-weight:800;">EDIT RECORD</p><br>

      <form id="form" v-on:submit.prevent="updateResident">

        <fieldset class="form-group">
          <label for="first_name">Name</label>
          <input type="text" class="form-control" id="first_name" name="first_name" v-model="currentResident.name">
        </fieldset>

        <input type="submit" class="btn btn-primary" value="Add New Resident">
      </form>

    </div>  

  </div>

</template>

    <script>

    import firebase from 'firebase'

    let editConfig = {
    apiKey: "123456789",
    authDomain: "myapp.firebaseapp.com",
    databaseURL: "https://myapp.firebaseio.com",
    projectId: "my",
    storageBucket: "myapp.appspot.com",
    messagingSenderId: "1234567890"
  };

  var firebaseApp = firebase.initializeApp(editConfig, "Edit")
  var db = firebaseApp.database()

  let residentsReference = db.ref('residents')

  export default {
    name: 'Edit',
    mounted() {
      this.currentResident.name = residentsArray.name;
    },
    firebase: {
      residentsArray: residentsReference.child('-KpzkbA6G4XvEHHMb9H0')
    },
    data () {
      return {
        currentResident: {
          name: ''
        }
      }
    },
    methods: {
      updateResident: function () {
        // Update record here
      }
    }
  }
</script>
4

2 回答 2

1

通过阅读Github上的READMEvuefire，您似乎需要通过以下方式引用firebase对象的属性this.$firebaseRefs：

mounted() {
  this.currentResident.name = this.$firebaseRefs.residentsArray.name;
},
于 2017-07-27T17:46:46.007 回答
1

你应该改变residentsArray.name你this.residentsArray.name的mounted钩子。

还有一件事：你不需要mounted这个。我只是computed为此做一个 return this.residentsArray.name。有了这个，你不会有任何绑定问题。

于 2017-08-30T09:54:29.270 回答