从 Axios 响应中解析 XML，推送到 Vue 数据数组

Question

在我的 Vue 应用程序中，我得到一个带有 Axios 的 XML 文件并使用 parseString 将 XML 解析为 JSON。然后我需要将 result 传递给 Vue 数据 (this.events)。我的 console.log 将解析后的 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？

Answer 1

尽量不要在parseString里面使用this，可能是作用域问题，也就是说this不是引用vue数据对象。

试试这个：

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

Answer 2

This answer 是正确的。但是，我会在任何地方都使用箭头函数，所以 this 始终是 VUE class 组件。另外，我会检查解析错误。

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

从 Axios 响应中解析 XML，推送到 Vue 数据数组

Parse XML from Axios response, pushing to Vue data array

xml

vue.js

axios

xml2js