const template = `
<{{elem.nodeName}}
{{attribute.name}}
=
"{{attribute.value}}"
>
{{this.children[0].data.trim()}}
</{{elem.nodeName}}>
<{{elem.nodeName}}
{{attribute.name}}
=
"{{attribute.value}}"
/>
>
{{elem.data.trim()}}
</{{elem.nodeName}}>
`
export default {
name: "xmltree",
props: {
d: {
type: Number,
default: 0
},
element: {
type: [Element, Text],
default: undefined
},
xmlData: String
},
template: template,
data() {
return {
depth: 1
}
},
methods: {
collapse() {
this.children.forEach(x => x.classList?.add("d-none"))
},
log(message) {
console.log(message)
}
},
computed: {
elem() {
this.depth = parseInt(this.d) + 1
if (this.element) {
return this.element
} else {
const parser = new DOMParser()
const xmlDoc = parser.parseFromString(this.xmlData, "text/xml")
return xmlDoc.documentElement
}
},
children() {
let children = []
let node = this.elem.firstChild
while (node) {
children.push(node)
node = node.nextSibling
}
return children
},
isText() {
if (this.children.length === 1) {
if (this.children[0].nodeType === 3) {
return true
}
}
return false
}
}
}