civiccc/react-waypoint

FireOnce Prop

NehemiahK opened this issue · 7 comments

It would be nice if you could pass in a prop for a waypoint to only fireOnce, afterwards it wouldn't fire again. I made my own wrapperelement because the use case has come up quite a bit. It should be a fairly simple implementation and would be quite useful. Alternatively you could have a fireCount prop in which you can state how many times the waypoint can fire onEnter/leave

I think this would make sense -- I'd be happy to accept a PR adding support for this usecase. In the meantime, do you want to share what your wrapper looks like? It might help others who land here. :)

@trotzig I could potentially make a PR, I'll need to dig around in the code. Would you want a fireCount or a fireOnce prop?

This is the current workaround implemented. (This was specifically done for onEnter, to work for onLeave it could be done similarly, would just need a bit of extra work)
`

import React from 'react'
import Waypoint from 'react-waypoint';

class HtWaypoint extends React.PureComponent{
    constructor(props){
        super(props);

        this.state = {firstLoad:true};
    }

    enter = (cb) => {
        if(this.props.fireOnce && !this.state.firstLoad)return;
        this.setState({firstLoad:false})
        cb();
    }

    render(){
        let {onEnter,...waypointProps} = this.props;
        return(
            <Waypoint onEnter={() => this.enter(onEnter)} {...waypointProps}>
                {this.props.children}
            </Waypoint>
         )
    }


}

HtWaypoint.defaultProps = {fireOnce:false,onEnter: ()=>{}};

export default HtWaypoint

Thanks! I think I'd prefer the fireOnce option. I don't see a clear use-case for the count so a boolean should do.

@trotzig follow up, if you implement fireOnce and you passed in onLeave, the onLEave function would never fire? What would make sense to you

In your use-case, it wouldn't make sense to fire onLeave, right? In that case, we could just add that behavior to the documentation (README file).

Sorry, to clarify, would fireOnce prop stop onLeave from firing? Since it wouldn't make sense to pass in the onLeave prop if you are passing in fireOnce. I

Yep, that was how I interpreted the feature! If people come across the fireOnce property and need the onLeave as well, we can just change the behavior in a later PR.