Skip to content

Instantly share code, notes, and snippets.

@phidn

phidn/determine-changed-props.js

Forked from sorenlouv/determine-changed-props.js
Created July 21, 2023 02:23
Show Gist options
  • Save phidn/6295a89056c61408c4de515e38ef33d2 to your computer and use it in GitHub Desktop.
Save phidn/6295a89056c61408c4de515e38ef33d2 to your computer and use it in GitHub Desktop.
Download ZIP

Revisions

  1. @sorenlouv sorenlouv revised this gist Sep 16, 2017. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion determine-changed-props.js
    View file
    Original file line number Diff line number Diff line change
    @@ -25,4 +25,4 @@ export default function withPropsChecker(WrappedComponent) {
    }

    // Usage
    withPropsChecker(myComponent)
    withPropsChecker(MyComponent)
  2. @sorenlouv sorenlouv revised this gist Sep 16, 2017. 1 changed file with 3 additions and 6 deletions.
    9 changes: 3 additions & 6 deletions determine-changed-props.js
    View file
    Original file line number Diff line number Diff line change
    @@ -1,9 +1,3 @@
    // Usage

    withPropsChecker(myComponent)

    // Implementation

    import React, { Component } from 'react';

    export default function withPropsChecker(WrappedComponent) {
    @@ -29,3 +23,6 @@ export default function withPropsChecker(WrappedComponent) {
    }
    };
    }

    // Usage
    withPropsChecker(myComponent)
  3. @sorenlouv sorenlouv revised this gist Sep 16, 2017. 1 changed file with 2 additions and 1 deletion.
    3 changes: 2 additions & 1 deletion determine-changed-props.js
    View file
    Original file line number Diff line number Diff line change
    @@ -1,7 +1,8 @@
    // Usage

    withPropsChecker(myComponent
    withPropsChecker(myComponent)

    // Implementation

    import React, { Component } from 'react';

  4. @sorenlouv sorenlouv revised this gist Sep 16, 2017. 1 changed file with 5 additions and 0 deletions.
    5 changes: 5 additions & 0 deletions determine-changed-props.js
    View file
    Original file line number Diff line number Diff line change
    @@ -1,3 +1,8 @@
    // Usage

    withPropsChecker(myComponent


    import React, { Component } from 'react';

    export default function withPropsChecker(WrappedComponent) {
  5. @sorenlouv sorenlouv created this gist Sep 16, 2017.
    25 changes: 25 additions & 0 deletions determine-changed-props.js
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,25 @@
    import React, { Component } from 'react';

    export default function withPropsChecker(WrappedComponent) {
    return class PropsChecker extends Component {
    componentWillReceiveProps(nextProps) {
    Object.keys(nextProps)
    .filter(key => {
    return nextProps[key] !== this.props[key];
    })
    .map(key => {
    console.log(
    'changed property:',
    key,
    'from',
    this.props[key],
    'to',
    nextProps[key]
    );
    });
    }
    render() {
    return <WrappedComponent {...this.props} />;
    }
    };
    }