Question

我正在尝试在nodejs中编写post api并使用vuejs作为前端框架工作并使用vue-resource访问apis。这是我在前端的提交功能。

validateBeforeSubmit() {
        var self = this;

        this.$validator.validateAll().then(result => {
          if (result) {
            self.data = self.name;
            console.log(this.data)
            this.$http.post('/api/add_level',self.data).then(function(res){
              this.status = res.body
              console.log(this.status);
            this.largeModal=false;
            // eslint-disable-next-line
            alert('From Submitted!');


            })
            return;

          }

这是我在服务器端的代码。

app.post('/api/add_level',function(req,res,err,data){
    console.log(data);
})

Answer 1

你有一个变量var self = this指向正确的vue instancre，那么为什么你在回调vue-resource的帖子请求时再次使用this

在方法中的每个地方使用self o引用vue实例。由于closures的概念，这是可能的。

所以请将您的代码更改为：

    this.$validator.validateAll().then(function(result) {
      if (result) {
        self.data = self.name;
        console.log(this.data)
        this.$http.post('/api/add_level',self.data).then(function(res){
          self.status = res.body
          console.log(self.status);
        self.largeModal=false;
        // eslint-disable-next-line
        alert('From Submitted!');


        })
        return;

      }

注意

我建议您使用普通函数语法并使用闭包或使用arrow function，因为它们在词汇上绑定this。不要混淆它们并同时使用

如何使用vuejs从post api中检索nodejs中的数据

1 个答案: