feat: Add new ReactPureJsonView component

[pgliang001]

Background
The react-json-view component is used more for displaying json data, that is, viewing mode, and often the displayed data comes from json files, json strings returned by APIs, etc.

Currently, the react-json-view component prop src only supports objects (including arrays), which requires external personnel to convert data through JSON.parse(json string). In addition, a recent commit provides big number support. The current display (JSON) data (processing results in other languages) may contain big numbers, such as 9223372036854775807, 0.0060254656709730629, etc. These are out of bounds in javascript and need to rely on third-party special packages (json-bigint, bignumber.js) for processing.

Solution
Currently, the ReactPureJsonView component (newly added) is provided, which can greatly improve the part of users who only display json data and avoid big number special processing logic. The prop src supports objects and strings. When it is an object, it is equivalent to the react-json-view component. When it is a string, (json-bigint, bignumber.js) parsing is automatically enabled by default.

Note: This component ReactPureJsonView is recommended for static data presenting. It is more friendly to this scenario. This is one of the reasons why the name contains "pure"

Code Example

     // Fetch data source(json string) from remote json file
    const data: string = await fetch('data/data.json')

    // Put the above result into prop `src`
    return <ReactPureJsonView src={data} />

That is so easy!

Expecting to your feedback, thank you.

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
react-json-view	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Feb 17, 2025 5:13am