对接收到的字符串xml进行格式化展示

今天遇到一个问题,后台接口返回了一个字符串,这个字符串是一个xml格式,现在需要给他展示出来并且格式要对

两种方法:

1、主要就是展示的数据用v-html包住,vue mounted中声明一个方法用于转换字符,methods中你获取到数据的时候对数据进行处理,我这里xmlData代表已经获取的数据,(这种方法有可能缩进不正常)

<div v-html="xmlData"></div>

mounted(){
     String.prototype.replaceAll = function(text, RepText){
        return this.replace(new RegExp(text, 'g'), RepExp)      
    }  
}


methods: {
  getdata(){
    this.xmlData = this.xmlData.replaceAll('>',&gt;)
.replaceAll('<',&lt;).replace(' ',<br>)

  }
}

2、这种方法很简单,并且很有效

//直接使用xmp标签包住获取到后台的字符串即可,也就是这里的xmlData,或者也可以用<pre>标签
<div> <xmp>     {{xmlData}}   </xmp> </div>
原文地址:https://www.cnblogs.com/shiyiersan/p/14234150.html