@@ -88,6 +88,7 @@ export default class Sticky extends Component {
8888 }
8989
9090 state = {
91+ active : true ,
9192 sticky : false ,
9293 }
9394
@@ -96,43 +97,47 @@ export default class Sticky extends Component {
9697
9798 componentDidMount ( ) {
9899 if ( ! isBrowser ( ) ) return
99- const { active } = this . props
100+ const { active } = this . state
100101
101102 if ( active ) {
102103 this . handleUpdate ( )
103- this . addListeners ( this . props )
104+ this . addListeners ( this . props . scrollContext )
104105 }
105106 }
106107
107- // eslint-disable-next-line camelcase
108- UNSAFE_componentWillReceiveProps ( nextProps ) {
109- const { active : current , scrollContext : currentScrollContext } = this . props
110- const { active : next , scrollContext : nextScrollContext } = nextProps
108+ static getDerivedStateFromProps ( props , state ) {
109+ if ( state . active !== props . active && ! props . active ) {
110+ return { active : props . active , sticky : false }
111+ }
111112
112- if ( current === next ) {
113- if ( currentScrollContext !== nextScrollContext ) {
114- this . removeListeners ( )
115- this . addListeners ( nextProps )
113+ return { active : props . active }
114+ }
115+
116+ componentDidUpdate ( prevProps , prevState ) {
117+ if ( prevState . active === this . state . active ) {
118+ if ( prevProps . scrollContext !== this . props . scrollContext ) {
119+ this . removeListeners ( prevProps . scrollContext )
120+ this . addListeners ( this . props . scrollContext )
116121 }
122+
117123 return
118124 }
119125
120- if ( next ) {
126+ if ( this . state . active ) {
121127 this . handleUpdate ( )
122- this . addListeners ( nextProps )
128+ this . addListeners ( this . props . scrollContext )
123129 return
124130 }
125131
126- this . removeListeners ( )
127- this . setState ( { sticky : false } )
132+ this . removeListeners ( prevProps . scrollContext )
128133 }
129134
130135 componentWillUnmount ( ) {
131136 if ( ! isBrowser ( ) ) return
132- const { active } = this . props
137+ const { active } = this . state
133138
134139 if ( active ) {
135- this . removeListeners ( )
140+ this . removeListeners ( this . props . scrollContext )
136141 cancelAnimationFrame ( this . frameId )
137142 }
138143 }
@@ -141,8 +146,7 @@ export default class Sticky extends Component {
141146 // Events
142147 // ----------------------------------------
143148
144- addListeners = ( props ) => {
145- const { scrollContext } = props
149+ addListeners = ( scrollContext ) => {
146150 const scrollContextNode = isRefObject ( scrollContext ) ? scrollContext . current : scrollContext
147151
148152 if ( scrollContextNode ) {
@@ -151,8 +155,7 @@ export default class Sticky extends Component {
151155 }
152156 }
153157
154- removeListeners = ( ) => {
155- const { scrollContext } = this . props
158+ removeListeners = ( scrollContext ) => {
156159 const scrollContextNode = isRefObject ( scrollContext ) ? scrollContext . current : scrollContext
157160
158161 if ( scrollContextNode ) {
0 commit comments