Skip to content

bluepeter/jsondiffpatch-react

Repository files navigation

jsondiffpatch-react

1. install

npm install jsondiffpatch-react 

2. usage

import React from 'react'; import JsonDiffReact from 'jsondiffpatch-react'; <JsonDiffReact right: PropTypes.any, left: PropTypes.any, show: PropTypes.bool, annotated: PropTypes.bool, tips: PropTypes.any, objectHash: PropTypes.func, />

3. component props

  • left (array, object, string)

  • right (array, object, string)

  • show (bool)

    you can show/hide unchanged values

  • annotated (bool)

    This will render the original JSON delta in html, with annotations aside explaining the meaning of each part. This attempts to make the JSON delta format self-explained.

  • tips (any)

    Displayed in case both elements are identical.

  • objectHash (function)

    Will be passed to jsondiffpatch to improve array comparison performance, as described here. Example:

    <JsonDiffReact left={left} right={right} objectHash={(obj: any) => obj.id || obj._id || obj.name || JSON.stringify(obj) } />

Development notes

To publish to NPM, change the version number in package.json and npm publish once complete. Then, go to Github Releases and follow the instructions to publish a new version there too.

About

Diff & patch JavaScript objects... in React

Topics

Resources

License

Stars

Watchers

Forks

Packages

No packages published

Contributors 6