Skip to content

Commit 93fb69b

Browse files
committed
Update Provider implementation and use storeState field
1 parent 6bed812 commit 93fb69b

File tree

2 files changed

+42
-35
lines changed

2 files changed

+42
-35
lines changed

src/components/Provider.js

Lines changed: 38 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -5,57 +5,64 @@ import {ReactReduxContext} from './Context'
55
class Provider extends Component {
66
constructor(props) {
77
super(props)
8+
9+
const {store} = props
10+
811
this.state = {
9-
state: props.store.getState(),
10-
store: props.store
12+
storeState : store.getState(),
13+
store,
1114
}
12-
this.unsubscribe = null
1315
}
1416

1517
componentDidMount() {
16-
this.isUnmounted = false
17-
const state = this.state.store.getState()
18-
this.unsubscribe = this.state.store.subscribe(this.triggerUpdateOnStoreStateChange.bind(this))
19-
20-
if (state !== this.state.state) {
21-
this.setState({ state })
22-
}
18+
this._isMounted = true
19+
this.subscribe()
2320
}
2421

2522
componentWillUnmount() {
26-
this.isUnmounted = true
27-
if (this.unsubscribe) this.unsubscribe()
23+
if(this.unsubscribe) this.unsubscribe()
24+
25+
this._isMounted = false
2826
}
2927

30-
componentDidUpdate(lastProps) {
31-
if (lastProps.store !== this.props.store) {
32-
if (this.unsubscribe) this.unsubscribe()
33-
this.unsubscribe = this.props.store.subscribe(this.triggerUpdateOnStoreStateChange.bind(this))
34-
this.setState({
35-
state: this.props.store.getState(),
36-
store: this.props.store
37-
})
28+
componentDidUpdate(prevProps) {
29+
if(this.props.store !== prevProps.store) {
30+
if(this.unsubscribe) this.unsubscribe()
31+
32+
this.subscribe()
3833
}
3934
}
4035

41-
triggerUpdateOnStoreStateChange() {
42-
if (this.isUnmounted) {
43-
return
44-
}
36+
subscribe() {
37+
const {store} = this.props
4538

46-
this.setState(prevState => {
47-
const newState = prevState.store.getState()
48-
if (prevState.state === newState) {
49-
return null
50-
}
51-
return {
52-
state: newState
39+
this.unsubscribe = store.subscribe( () => {
40+
const newStoreState = store.getState()
41+
42+
if(!this._isMounted) {
43+
return
5344
}
45+
46+
this.setState(providerState => {
47+
// If the value is the same, skip the unnecessary state update.
48+
if(providerState.storeState === newStoreState) {
49+
return null
50+
}
51+
52+
return {storeState : newStoreState}
53+
})
5454
})
55+
56+
// Actions might have been dispatched between render and mount - handle those
57+
const postMountStoreState = store.getState()
58+
if(postMountStoreState !== this.state.storeState) {
59+
this.setState({storeState : postMountStoreState})
60+
}
5561
}
5662

5763
render() {
5864
const Context = this.props.context || ReactReduxContext
65+
5966
return (
6067
<Context.Provider value={this.state}>
6168
{this.props.children}

src/components/connectAdvanced.js

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -186,9 +186,9 @@ export default function connectAdvanced(
186186
`or pass a custom React context provider to <Provider> and the corresponding ` +
187187
`React context consumer to ${displayName} in connect options.`
188188
)
189-
const { state, store } = value
189+
const { storeState, store } = value
190190
const { forwardRef, props } = this.props
191-
let derivedProps = this.generatedDerivedProps(state, props, store)
191+
let derivedProps = this.generatedDerivedProps(storeState, props, store)
192192
if (connectOptions.pure) {
193193
return <PureWrapper derivedProps={derivedProps} forwardRef={forwardRef} />
194194
}
@@ -203,8 +203,8 @@ export default function connectAdvanced(
203203
`or pass a custom React context provider to <Provider> and the corresponding ` +
204204
`React context consumer to ${displayName} in connect options.`
205205
)
206-
const { state, store } = value
207-
let derivedProps = this.generatedDerivedProps(state, this.props, store)
206+
const { storeState, store } = value
207+
let derivedProps = this.generatedDerivedProps(storeState, this.props, store)
208208
if (connectOptions.pure) {
209209
return <PureWrapper derivedProps={derivedProps} />
210210
}

0 commit comments

Comments
 (0)