Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/talljack/vue3-json-view
vue3 json view, better to use
https://github.com/talljack/vue3-json-view
jsonview vue3
Last synced: about 20 hours ago
JSON representation
vue3 json view, better to use
- Host: GitHub
- URL: https://github.com/talljack/vue3-json-view
- Owner: Talljack
- License: mit
- Created: 2021-06-26T04:30:48.000Z (over 3 years ago)
- Default Branch: main
- Last Pushed: 2023-01-07T08:53:04.000Z (about 2 years ago)
- Last Synced: 2024-08-09T04:57:04.707Z (6 months ago)
- Topics: jsonview, vue3
- Language: Vue
- Homepage:
- Size: 1.25 MB
- Stars: 4
- Watchers: 1
- Forks: 0
- Open Issues: 3
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# vue3-json-view
Typescript support a vue3-json-view lib which can better show
## 🦄 Usage
```
It is recommended to use this way
import JsonView from "vue3-json-view"
in vue3
setup () {
components: {
JsonView
},
const data = reactive({
name: 'yugang.cao',
age: 23,
home: 'my home'
})
return {
data
}
}
or
in main.js
import { JsonView } from 'vue3-json-view'
app.use(JsonView)
```
## 📦 Install
```bash
npm i vue3-json-view --save
or
yarn add vue3-json-view --save
```
## 相关配置说明
| 属性 | 说明 | 类型 | 默认值 |
| --- | --- | --- | --- |
| data | 传入的 json 数据（必填） | Object | - |
| closed | 是否折叠全部 | Boolean | false |
| deep | 展开深度,越大渲染速度越慢,建议不超过 5 | Number | 3 |
| icon-style | 折叠按钮样式，可选值为 square、circle、triangle | String | square |
| icon-color | 两个折叠按钮的颜色 | Array | theme=vs-code 时，['#c6c6c6', '#c6c6c6']，其他情况为['#747983', '#747983'] |
| theme | 可选主题样式,可选值为 one-dark、vs-code，不选时为默认的白色主题 | String | - |
| json-key | 显示对象的 key 值 | String | '' |
| font-size | 字体大小,单位 px | Number | 14 |
| line-height | 行高，单位 px | Number | 24 |
## 🌸 Thanks
This project is heavily inspired by the following awesome projects.
- [vue-json-view](https://github.com/zhaoxuhui1122/vue-json-view)
## 📄 License
[MIT License](https://github.com/Talljack/vue3-json-view/blob/main/LICENSE) © 2021-PRESENT [caoyugang_1](https://github.com/Talljack)