Shallow-equal-props NPM

shallow-equal-props

Shallow Equal for React's props.

It is a customize version of shallow-equal-object.

Features

Shallow equal for objects
- It is based shallow-equal-object
Support React.Element
- Check equality React.Element if props include React.Element like children,

Install

Install with npm:

npm install shallow-equal-props

Usage

Shallow equal for props.

import { shallowEqualProps } from "shallow-equal-props";
import * as React from "react";
class MyComponent extends React.Component {
    shouldComponentUpdate(nextProps){
        return !shallowEqualProps(this.props, nextProps);
    }
}

Support React.Element

// equal to React.Element
// Check: key and type
const elementA = React.createElement("div", { key: "a" });
const elementB = React.createElement("div", { key: "a" });
assert.equal(shallowEqualProps({
    child: elementA
}, {
    child: elementB
}), true, "should be equal");
// Not equal: type
const elementA = React.createElement("div", { key: "a" });
const elementB = React.createElement("span", { key: "a" });
assert.equal(shallowEqualProps({
    child: elementA
}, {
    child: elementB
}), false, "element is not same type");
// Not equal: key
const elementA = React.createElement("div", { key: "a" });
const elementB = React.createElement("div", { key: "b" });
assert.equal(shallowEqualProps({
    child: elementA
}, {
    child: elementB
}), false, "elementA is not equal elementB");