Closed guludo closed 6 years ago
Otherwise any withAlert() component that is not the first one will keep the reference to an out of date list of alerts and show them when its render method is evetually called. That can be reproduced with the following code:
import React, { Component, Fragment } from 'react' import { withAlert } from 'react-alert' const Foo = ({alert}) => (<button onClick={() => { alert.info('Foo') }}>Foo</button>); const FooWithAlert = withAlert(Foo); const Bar = ({ alert }) => (<button onClick={() => { alert.info('Bar') }}>Bar</button>); const BarWithAlert = withAlert(Bar); class Home extends Component { state = { now: Date.now() } render () { return ( <div> <FooWithAlert /> <BarWithAlert /> <br /> <button onClick={() => {this.setState({ now: Date.now() })}}> Render wrapping component </button> </div> ) } } export default Home
This fixes #63
Awesome job @guludo! Thank you for find a fix as well as submitting the issue! I will be publishing a new version with your fix today.
Thanks!
Otherwise any withAlert() component that is not the first one will keep the reference to an out of date list of alerts and show them when its render method is evetually called. That can be reproduced with the following code: