Skip to content

An NPM package to display json data inside your views easily in one line

Notifications You must be signed in to change notification settings

Omrani-Mahmoud/json-ui-react

Repository files navigation

Json UI React

display json ui for react

NPM JavaScript Style Guide

Install

npm install --save json-ui-react

Usage

import React, { Component } from 'react'

import JsonDisplay from 'json-ui-react'
import 'json-ui-react/dist/index.css'

let data =[{
    "glossary": {
        "title": "example glossary",
		"GlossDiv": {
            "title": "S",
			"GlossList": {
                "GlossEntry": {
                    "ID": "SGML",
					"SortAs": "SGML",
					"GlossTerm": "Standard Generalized Markup Language",
					"Acronym": "SGML",
					"Abbrev": "ISO 8879:1986",
					"GlossDef": {
                        "para": "A meta-markup language, used to create markup languages such as DocBook.",
						"GlossSeeAlso": ["GML", "XML"]
                    },
					"GlossSee": "markup"
                }
            }
        }
    }
}];
class Example extends Component {
  render() {
    return <JsonDisplay data={data} />
  }
}

image

Props

Prop name Description Default Example
data the data that will be displayed ( json ) - data={[{ "name":"John", "age":30, "car":null }]}
height the height of the json container ( will be scrollable automatically ) auto height={400}

License

MIT © Omrani-Mahmoud

About

An NPM package to display json data inside your views easily in one line

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published