jsondiffpatch-for-react

Based on https://github.com/benjamine/jsondiffpatch

1. install

npm install jsondiffpatch-for-react

2. usage

1import React from 'react';
2import JsonDiffReact from 'jsondiffpatch-for-react';
3
4<JsonDiffReact
5    right: PropTypes.any,
6    left: PropTypes.any,
7    show: PropTypes.bool,
8    annotated: PropTypes.bool,
9    tips: PropTypes.string,
10    objectHash: PropTypes.func,
11/>

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 (string)

  Message that will displayed in case both elements are identical.

• objectHash (function)

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

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