search

tomchentw / react-toastr

React.js toastr component
https://tomchentw.github.io/react-toastr/
MIT License
619 stars 112 forks source link

Display toastr on each item component in a list #84

Closed lednhatkhanh closed 8 years ago

lednhatkhanh commented 8 years ago

I have a component name Tasks, inside that component, I render a lot of same components named Task.

I put this code:

<ToastContainer ref="toastrContainer"
                    toastMessageFactory={ToastMessageFactory}
                    className="toast-top-right" />

Inside of the Task component, but each time I call the toastr:

this.refs.toastrContainer.error(
            error.reason,
            error.error, {
            closeButton: true,
        });

I always got this error TypeError: Cannot read property 'error' of undefined, but it work fine on the other stand-alone component tho.Could you help me with it, thank you.

I think it's because now my react page has a whole bunch of Task component that has the same toastrContainer ref...

lednhatkhanh commented 8 years ago

Oh, it can be fixed by invoking the method from the parent component, but I think there should be a better way to call this other than using refs.