TypeError: Cannot read property 'show' of undefined

[rickwierenga]

Hi,

I'm trying to use props.alert with withAlert, but no props are set. Looking at this file, I'd expect it to be set...

Alerts.js:

import React, { Component, Fragment } from "react";
import { withAlert } from "react-alert";

export class Alerts extends Component {
  componentDidMount() {
    this.props.alert.show("test"); // crashes here
  }

  render() {
    return <Fragment />;
  }
}

export default withAlert()(Alerts);

App.js:

import React from "react";
import { positions, Provider as AlertProvider } from "react-alert";
import AlertTemplate from "react-alert-template-basic";
import { Alerts } from "./components/Alerts";

function App() {
  return (
    <div className="App">
      <AlertProvider template={AlertTemplate}>
        <Alerts />
        <h1>App</h1>
      </AlertProvider>
    </div>
  );
}

export default App;

[rickwierenga]

Hm weird, I just recreated the file and it worked here too... Anyway, thanks for your quick reply!

[schiehll]

Hey @rickwierenga!

Seems to be working just fine here: https://codesandbox.io/s/flamboyant-rain-cpeqe?file=/src/App.js

Github was acting weird and not letting me paste the link, so I had to create a new comment.