Question

我遇到了一个奇怪的问题，我不知道这是IDE还是拼写错误？我有以下代码，但我的IDE表示创建的函数未使用，并且数据未从firebase加载。如果我要在它上面键入另一个创建的生命周期钩子，它将不再显示未使用的，但是很显然它抱怨它是重复的。请问我做错了什么？

    import db from '@/fb'
    import project from './project.vue'
    export default {
        data(){
            return {
                projects: []
            }
        },
        methods: {
          completed(tasks){
              let done = 0;
              for (const task of tasks)
              {
                  if(task.complete === true){
                      done ++;
                  }
              }
              return done;
          }
        },
        created(){
            db.collection('projects').onSnapshot(res => {
                const changes = res.docChanges();
                changes.forEach(change => {
                    if(change.type === 'added'){
                        this.projects.push({
                            ...change.doc.data(),
                            id: change.doc.id
                        })
                    }
                })
            })
        },
        components: {
            appProject: project
        }
    }

Answer 1

您应该尝试定义它是一个函数。因此，您应该写created()

而不是写created: function()

   import db from '@/fb'
import project from './project.vue'
export default {
    data(){
        return {
            projects: []
        }
    },
    methods: {
      completed(tasks){
          let done = 0;
          for (const task of tasks)
          {
              if(task.complete === true){
                  done ++;
              }
          }
          return done;
      }
    },
    created: function(){
        db.collection('projects').onSnapshot(res => {
            const changes = res.docChanges();
            changes.forEach(change => {
                if(change.type === 'added'){
                    this.projects.push({
                        ...change.doc.data(),
                        id: change.doc.id
                    })
                }
            })
        })
    },
    components: {
        appProject: project
    }
}

阅读有关生命周期挂钩的vuejs.org/指南。

使用VueJS创建了生命周期挂钩问题

1 个答案: