I want to get the input for React JS as XML format instead of json format. So please reply how to display XML in React js .
How to display xml data using Reactjs
24.6k views Asked by Sa Si Kumar At
4
There are 4 answers
0
On
I know this is an old post, but might help some people. To display XML data, I just use the pre element. If you don't need extra functionalities like collapse/uncollapse nodes, then this should do for you.
<pre className="xml-body">
{this.props.xmlstr}
</pre>
Then you can just style pre with stripe background...
pre.body {
width: 100%;
display: block;
max-height: 500px;
overflow: auto;
margin: 0;
padding: 0 5px;
background: #F3F2F2;
background-image: -webkit-linear-gradient(#F3F2F2 50%, #EBEAEA 50%);
background-image: -moz-linear-gradient(#F3F2F2 50%, #EBEAEA 50%);
background-image: -ms-linear-gradient(#F3F2F2 50%, #EBEAEA 50%);
background-image: -o-linear-gradient(#F3F2F2 50%, #EBEAEA 50%);
background-image: linear-gradient(#F3F2F2 50%, #EBEAEA 50%);
background-position: 0 0;
background-repeat: repeat;
background-attachment: local;
background-size: 4em 4em;
line-height: 2em;
display: none;
}
Hope this helps someone :)
I would suggest you parse your xml data to a Javascript object. You can the xml2js library to this end.