mirrors/vue-json-viewer
2
0
Fork 0
mirror of https://github.com/tenrok/vue-json-viewer.git synced 2026-06-02 16:04:08 +03:00
Code Activity

Migrate all types

Browse Source
This commit is contained in:
Eliott Vincent
2021-08-16 17:18:46 +02:00
parent aef094fb67
commit cff5702ca1
8 changed files with 63 additions and 94 deletions
Download Patch File Download Diff File Expand all files Collapse all files
lib/types/json-array.vue
+14 -27
View File
@@ -1,4 +1,5 @@
<script>
import { h } from 'vue'
import JsonBox from '../json-box'
export default {
@@ -57,9 +58,9 @@ export default {
this.$el.dispatchEvent(evt)
}
},
},
render (h) {
render () {
let elements = []
if (!this.previewMode && !this.keyName) {
@@ -68,9 +69,7 @@ export default {
'jv-toggle': true,
'open': !!this.expand,
},
on: {
click: this.toggle
}
onClick: this.toggle
}))
}
@@ -79,9 +78,7 @@ export default {
'jv-item': true,
'jv-array': true,
},
domProps: {
innerText: '['
}
innerText: '['
}))
if (this.expand) {
this.value.forEach((value, key) => {
@@ -90,13 +87,11 @@ export default {
style: {
display: this.expand ? undefined : 'none'
},
props: {
sort: this.sort,
// keyName: key,
depth: this.depth + 1,
value,
previewMode: this.previewMode,
}
sort: this.sort,
// keyName: key,
depth: this.depth + 1,
value,
previewMode: this.previewMode,
}))
})
}
@@ -109,15 +104,9 @@ export default {
class: {
'jv-ellipsis': true,
},
on: {
click: this.toggle
},
attrs: {
title: `click to reveal ${this.value.length} hidden items`
},
domProps: {
innerText: '...'
}
onClick: this.toggle,
title: `click to reveal ${this.value.length} hidden items`,
innerText: '...'
}))
}
@@ -126,9 +115,7 @@ export default {
'jv-item': true,
'jv-array': true,
},
domProps: {
innerText: ']'
}
innerText: ']'
}))
return h('span', elements)
lib/types/json-boolean.vue
+4 -4
View File
@@ -1,19 +1,19 @@
<script>
import { h } from 'vue'
export default {
name: 'JsonBoolean',
functional: true,
props: {
jsonValue: Boolean
},
render (h, { props }) {
render () {
return h('span', {
class: {
'jv-item': true,
'jv-boolean': true,
},
domProps: {
innerText: props.jsonValue.toString()
}
innerText: this.jsonValue.toString()
})
}
}
lib/types/json-date.vue
+6 -6
View File
@@ -1,4 +1,6 @@
<script>
import { h } from 'vue'
export default {
name: 'JsonDate',
inject: ['timeformat'],
@@ -9,18 +11,16 @@ export default {
required: true
}
},
render (h, { props, injections }) {
const value = props.jsonValue;
const timeformat = injections.timeformat;
render () {
const value = this.jsonValue;
const timeformat = this.timeformat;
return h('span', {
class: {
'jv-item': true,
'jv-string': true,
},
domProps: {
innerText: `"${timeformat(value)}"`
}
innerText: `"${timeformat(value)}"`
})
}
};
lib/types/json-function.vue
+5 -5
View File
@@ -1,4 +1,6 @@
<script>
import { h } from 'vue'
export default {
name: 'JsonFunction',
functional: true,
@@ -8,18 +10,16 @@ export default {
required: true
}
},
render (h, { props }) {
render () {
return h('span', {
class: {
'jv-item': true,
'jv-function': true,
},
attrs: {
title: props.jsonValue.toString()
title: this.jsonValue.toString()
},
domProps: {
innerHTML: '&lt;function&gt;'
}
innerHTML: '&lt;function&gt;'
})
}
}
lib/types/json-number.vue
+5 -5
View File
@@ -1,4 +1,6 @@
<script>
import { h } from 'vue'
export default {
name: 'JsonNumber',
functional: true,
@@ -8,8 +10,8 @@ export default {
required: true
}
},
render (h, { props }) {
const isInteger = Number.isInteger(props.jsonValue)
render () {
const isInteger = Number.isInteger(this.jsonValue)
return h('span', {
class: {
@@ -18,9 +20,7 @@ export default {
'jv-number-integer': isInteger,
'jv-number-float': !isInteger,
},
domProps: {
innerText: props.jsonValue.toString()
}
innerText: this.jsonValue.toString()
})
}
}
lib/types/json-object.vue
+14 -26
View File
@@ -1,4 +1,5 @@
<script>
import { h } from 'vue'
import JsonBox from '../json-box'
export default {
@@ -67,7 +68,7 @@ export default {
}
}
},
render (h) {
render () {
let elements = []
if (!this.previewMode && !this.keyName) {
@@ -76,9 +77,7 @@ export default {
'jv-toggle': true,
'open': !!this.expand,
},
on: {
click: this.toggle
}
onClick: this.toggle
}))
}
@@ -87,9 +86,7 @@ export default {
'jv-item': true,
'jv-object': true,
},
domProps: {
innerText: '{'
}
innerText: '{'
}))
if (this.expand) {
@@ -102,13 +99,12 @@ export default {
style: {
display: !this.expand ? 'none' : undefined
},
props: {
sort: this.sort,
keyName: key,
depth: this.depth + 1,
value,
previewMode: this.previewMode,
}
sort: this.sort,
keyName: key,
depth: this.depth + 1,
value,
previewMode: this.previewMode,
}))
}
}
@@ -122,15 +118,9 @@ export default {
class: {
'jv-ellipsis': true,
},
on: {
click: this.toggle
},
attrs: {
title: `click to reveal object content (keys: ${Object.keys(this.ordered).join(', ')})`
},
domProps: {
innerText: '...'
}
onClick: this.toggle,
title: `click to reveal object content (keys: ${Object.keys(this.ordered).join(', ')})`,
innerText: '...'
}))
}
@@ -139,9 +129,7 @@ export default {
'jv-item': true,
'jv-object': true,
},
domProps: {
innerText: '}'
}
innerText: '}'
}))
return h('span', elements)
lib/types/json-string.vue
+11 -17
View File
@@ -1,5 +1,9 @@
<script>
import { h } from 'vue'
// TODO: check?
const REG_LINK = /^\w+:\/\//;
// const REG_LINK =/^([hH][tT]{2}[pP]:\/\/|[hH][tT]{2}[pP][sS]:\/\/)(([A-Za-z0-9-~]+)\.)+([A-Za-z0-9-~\/])+$/;
export default {
name: 'JsonString',
@@ -25,7 +29,7 @@ export default {
this.expand = !this.expand;
}
},
render (h) {
render () {
let value = this.jsonValue;
const islink = REG_LINK.test(value)
let domItem
@@ -35,12 +39,8 @@ export default {
class: {
'jv-ellipsis': true,
},
on: {
click: this.toggle
},
domProps: {
innerText: '...'
}
onClick: this.toggle,
innerText: '...'
};
} else {
domItem = {
@@ -52,16 +52,12 @@ export default {
}
if (islink) {
value = `<a href="${value}" target="_blank" class="jv-link">${value}</a>`;
domItem.domProps = {
innerHTML: `"${value.toString()}"`
}
domItem.innerHTML = `"${value.toString()}"`
} else {
domItem.domProps = {
innerText: `"${value.toString()}"`
}
domItem.innerText = `"${value.toString()}"`
}
}
return h('span', {}, [
this.canExtend && h('span', {
@@ -69,9 +65,7 @@ export default {
'jv-toggle': true,
open: this.expand,
},
on: {
click: this.toggle,
}
onClick: this.toggle,
}),
h('span', {
class: {
lib/types/json-undefined.vue
+4 -4
View File
@@ -1,4 +1,6 @@
<script>
import { h } from 'vue'
export default {
name: 'JsonUndefined',
functional: true,
@@ -8,15 +10,13 @@ export default {
default: null
}
},
render (h, { props }) {
render () {
return h('span', {
class: {
'jv-item': true,
'jv-undefined': true,
},
domProps: {
innerText: props.jsonValue === null ? 'null' : 'undefined'
}
innerText: this.jsonValue === null ? 'null' : 'undefined'
})
}
}