Working on the drum machine here, had pads displaying and playing (on click, at least). When I tried to add a way to manage the display (to display the hit sound), all disappeared. I get "object error {}" in the console and devtools tells me "cannot read property display of null" Can anyone tell me what the issue is in the display object / how to get it to display?
You are getting that error because you haven’t set the initial state in App.
Include this.state = {display: ''} in your App's constructor.
Thank you . I didn’t know that you had to set an initial state to modify it later in functions. Anyway, now the Display element (and other elements) are there but not updating. I feel like it has to do with how playSound is tied to update Display but I am not following where/why it fails. Any thoughts?
You need to pass the updateDisplay prop through the <PadBank /> to the <DrumPad/> component (you are skipping a component in between right now when passing the callback).
1 Like