mirror of
https://github.com/tenrok/vue-json-viewer.git
synced 2026-06-14 18:42:31 +03:00
56 lines
942 B
Markdown
56 lines
942 B
Markdown
# vue-json-viewer
|
||
|
||
Simple json display component, based on vue
|
||
|
||
## Installing:
|
||
Using npm:
|
||
```
|
||
$ npm install vue-json-viewer
|
||
```
|
||
Using bower:
|
||
|
||
|
||
```
|
||
$ yarn add vue-json-viewer
|
||
```
|
||
|
||
## Example:
|
||
|
||
``` html
|
||
<json-viewer :value="jsonData" :show-copy="true" icon-prefix="ion" :show-bigger="true"></json-viewer>
|
||
```
|
||
|
||
``` js
|
||
export default {
|
||
name: 'Page',
|
||
data() {
|
||
return {
|
||
jsonData: {
|
||
name: [
|
||
{key: 2},
|
||
{key: 'hello word'},
|
||
],
|
||
val: {
|
||
b: 'a',
|
||
a: 'hello word',
|
||
asd2: 1,
|
||
asd: false
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
```
|
||
## Result
|
||

|
||
|
||
|
||
## Options:
|
||
|
||
| Property | Description |
|
||
| ----------- |:-------------|
|
||
| value | json data |
|
||
| show-copy | display the copy button |
|
||
| show-bigger | display the bigger button |
|
||
| icon-prefix | Custom Font icon prefix |
|