从Axios响应中解析XML,推送到Vue数据阵列

时间:2018-02-14 13:17:07

标签: xml vue.js axios xml2js

在我的Vue应用程序中,我获得了一个包含Axios的XML文件,并使用parseString将XML解析为JSON。然后我需要将result传递给Vue数据(this.events)。我的控制台日志将解析后的XML显示为Json,但我无法在此函数中推送到Vue数据。

var parseString = require('xml2js').parseString;

axios.get(`http://url.to/events.xml`)
  .then(response => {
    parseString(response.data, function (err, result) {
      console.log(result); // returns a json array
      this.events = result // nothing happens
    });        
  })
}

如何在Vue中将我的JSON数组存储到this.data?

2 个答案:

答案 0 :(得分:3)

以上答案正确。但是,我只会在各处使用箭头函数,因此this始终是VUE类组件。另外,我还会检查解析错误。

axios.get('http://url.to/events.xml')
  .then(response => {
    parseString(response.data, (err, result) => {
      if(err) {
       //Do something
      } else {
       this.events = result
     }
    });        
  })
}

答案 1 :(得分:2)

尽量不要在this内使用parseString,也许这是一个范围问题,这意味着this不会引用vue数据对象。

试试这个:

axios.get('http://url.to/events.xml')
  .then(response => {
    var self = this; 
    parseString(response.data, function (err, result) {
      self.events = result
    });        
  })
}