https://github.com/l2silver/khange
https://github.com/l2silver/khange
Last synced: 6 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/l2silver/khange
- Owner: l2silver
- Created: 2017-06-09T13:08:06.000Z (about 9 years ago)
- Default Branch: master
- Last Pushed: 2018-05-22T14:12:24.000Z (about 8 years ago)
- Last Synced: 2025-01-30T15:48:59.483Z (over 1 year ago)
- Language: JavaScript
- Size: 28.3 KB
- Stars: 1
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Khange
Higher Order Component for on start and on props change logic.
## Setup
```
npm i -S khange
```
## Use
```
import khange from 'khange'
const functionThatChecksWhetherIncomingPropsHaveChanged = (oldProps /* this.props or {} if onStart */, nextProps) => {
return oldProps.name === nextProps.name;
}
const onChange = (props)=>props.loadNewData();
khange(functionThatChecksWhetherIncomingPropsHaveChanged, onChange)
```
### Kheck
A simple utility function that takes any number of string arguments and checks whether the new prop is different that the old old
```
kheck('user.name') === (props, nextProps)=>(props.user.name === nextProps.user.name)
kheck('user.name', 'date') /* checks both properies, and if either one is not equal, returns false */
```
### Example
```
import khange, {kheck} from 'khange'
const Simple = ()=>
Hello
const SimpleWithOnChange = khange(kheck('simple'), (props)=>props.loadMoreData())
// loadMoreData on mount and when ever the simple prop changes then loadMoreData
```
### Advanced Example
```
import khange, {kheck} from 'khange'
const Simple = ()=>
Hello
const SimpleWithOnChange = khange([kheck('simple'), (props)=>props.loadMoreData(), kheck('advanced'), (props)=>props.loadMoreAdvancedData()])
// run multiple checks for changes and different onChange functions when those equality functions fails
```