在创建组件之前,我正在对某些本地json数据进行异步调用。因此,这段代码实际上可以正常工作:

  beforeCreate : function() {
    var self = this;
      fetch('/assets/data/radfaces.json')
        .then(function(response) { return response.json()
        .then( function(data) { self.users = data; } );
      })
        .catch(function(error) {
        console.log(error);
      });
  },

现在,我只想重构并将其移至单独的方法:
  beforeCreate : function() {
    this.fetchUsers();
  },

  methods: {
    fetchUsers: function() {
      var self = this;
      fetch('/assets/data/radfaces.json')
        .then(function(response) { return response.json()
        .then( function(data) { self.users = data; } );
      })
        .catch(function(error) {
        console.log(error);
      });
    }
  }

现在一切都停止了。我收到一个错误:app.js:13 Uncaught TypeError: this.fetchUsers is not a function(…)
为什么我不能访问fetchUsers钩子(Hook)中的beforeCreate方法?解决的方法是什么?

最佳答案

这是因为methods尚未初始化。解决此问题的最简单方法是改为使用created钩子(Hook):

  created : function() {
    this.fetchUsers();
  },

  methods: {
    fetchUsers: function() {
      var self = this;
      fetch('/assets/data/radfaces.json')
        .then(function(response) { return response.json()
        .then( function(data) { self.users = data; } );
      })
        .catch(function(error) {
        console.log(error);
      });
    }
  }

关于ajax - beforeCreate Hook 中的Vue 2.1调用方法不起作用,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/40890389/

10-11 22:49
查看更多