vue如何解析xml文件 x2js
好久没来写东西了,主要是一直在加班,哼哼,不开心
项目中会用到将xml文件解析成json文件在页面中显示出来,以前jq的时候用到的方法行不通了,故在这边介绍一种我觉得还不错的插件
1. npm安装
npm i x2js
2.在main.js中引用
import x2js from 'x2js' //xml数据处理插件
Vue.prototype.$x2js = new x2js() //创建x2js对象,挂到vue原型上
3.在组件中使用
_getVersion(url) {
this.loading = true;
let _self = this;
this.$ajax.get(`/data/version${url}.xml`).then(function(res) {
_self.loading = false;
console.log(res.data);
/* var x2js = new X2JS();*/
/* var obj = x2js.xml_str2json(res.data).note;*/
var jsonObj = _self.$x2js.xml2js(res.data);
console.log("-----");
console.log(jsonObj.note);
_self.tableData = jsonObj.note.specialityList.item;
_self.changeData = jsonObj.note.changeList.item;
_self.finishData = jsonObj.note.finishedPunchList.item;
_self.knownData = jsonObj.note.questionList.item;
_self.versionDes = jsonObj.note.name;
_self.versionDate = jsonObj.note.date;
})
.catch(function(err) {
console.log(err)
_self.loading = false;
});
}
注意:你的xml文件如果是放在前端这边的话,要把文件放到public文件夹当中,否则文件将会报404的错
vue如何解析xml文件 x2js的更多相关文章
- Android 解析XML文件和生成XML文件
解析XML文件 public static void initXML(Context context) { //can't create in /data/media/0 because permis ...
- JAVA使用SAX解析XML文件
在我的另一篇文章(http://www.cnblogs.com/anivia/p/5849712.html)中,通过一个例子介绍了使用DOM来解析XML文件,那么本篇文章通过相同的XML文件介绍如何使 ...
- JAVA中使用DOM解析XML文件
XML是一种方便快捷高效的数据保存传输的格式,在JSON广泛使用之前,XML是服务器和客户端之间数据传输的主要方式.因此,需要使用各种方式,解析服务器传送过来的信息,以供使用者查看. JAVA作为一种 ...
- java中采用dom4j解析xml文件
一.前言 在最近的开发中用到了dom4j来解析xml文件,以前听说过来解析xml文件的几种标准方式:但是从来的没有应用过来,所以可以在google中搜索dmo4j解析xml文件的方式,学习一下dom4 ...
- XML:使用DOM技术解析xML文件中的城市,实现select级联选择
中国的城市xml格式:cities.xml <?xml version="1.0" encoding="utf-8"?> <china> ...
- dom4j如何解析XML文件
最近在 一些对xml文件的操作,下面简单写一个dom4j解析xml文件并将其封装到一个javabean中的例子,只是具有针对性的,不是通用的,仅供参考哦~~ 首先说:dom4j是一个java的XML ...
- java解析XML文件
dom4j是一个Java的XML API,类似于jdom,用来读写XML文件的.dom4j是一个非常非常优秀的Java XML API,具有性能优异.功能强大和极端易用使用的特点,同时它也是一个开放源 ...
- Android开发学习---使用XmlPullParser解析xml文件
Android中解析XML的方式主要有三种:sax,dom和pull关于其内容可参考:http://blog.csdn.net/liuhe688/article/details/6415593 本文将 ...
- SAX解析xml文件
需要做一个银行名字的列表. 因为有很多,所以想到了用xml来保存,然后uongDAX解析. public class BankSelectActivity extends BaseActivity{ ...
随机推荐
- Java 种15种锁的介绍:公平锁,可重入锁,独享锁,互斥锁等等…
Java 中15种锁的介绍 1,在读很多并发文章中,会提及各种各样的锁,如公平锁,乐观锁,下面是对各种锁的总结归纳: 公平锁/非公平锁 可重入锁/不可重入锁 独享锁/共享锁 互斥锁/读写锁 乐观锁/悲 ...
- [C4W4] Convolutional Neural Networks - Special applications: Face recognition & Neural style transfer
第四周:Special applications: Face recognition & Neural style transfer 什么是人脸识别?(What is face recogni ...
- 鲜贝7.3--mysql 下载小问题
安装mysql 5.7.20 及报错 This application requires Visual Studio 2013 Redistributable 问题原因大体是mysql自动安装的Vis ...
- NOIP模拟赛 最佳组合
题目描述 Description \(Bzeroth\) 大陆最终还是覆灭了,所以你需要为地灾军团服务了. 地灾军团军师黑袍不擅长写题面,所以你只需要看简化版的题意即可. 给定 \(3\) 个长度均为 ...
- NOIP模拟赛 迷路
题目描述 Description \(FYH\) 在 \(ns\) 星系迷路了,情急之下,他找到了你.现在,解救 \(FYH\) 的重任就落在了你的肩上了. \(ns\) 星系有 \(n\) 颗星球, ...
- ICP 匹配定位算法学习记录
icp 算法原理是: 选取目标点云P和源点云Q,按照一定的约束条件,找到最邻近点(pi,qi),然后计算出最优R和t(旋转和平移), 使得误差函数最小,误差函数E(R,t): 基本算法流程: 1.在目 ...
- pixijs shader贴图扫光效果
pixijs shader贴图扫光效果 直接贴代码 const app = new PIXI.Application({ transparent: true }); document.body.app ...
- python xpath图片爬取
import requests from urllib.request import urlretrieve from lxml import etree headers = { 'User-Agen ...
- 【10】Nginx:后面有无 / 的区别
写在前面的话 在 nginx 中,我们很多时候都有一个疑问,在 proxy_pass 或者 root 或者 location 后面需不需要加上 /,加和不加有啥区别. root / alias 后面 ...
- Python - 错误和异常 - 第十九天
Python 错误和异常 作为 Python 初学者,在刚学习 Python 编程时,经常会看到一些报错信息,在前面我们没有提及,这章节我们会专门介绍. Python 有两种错误很容易辨认:语法错误和 ...