Redux-React通过mapDispatchToProps方法传递对象

Question

I am passing an object via the mapDispatchToProps method on lines 214 and 249. The code executed on 214 seems fine but when I do the same thing on 249 it throws me the following error :

Objects are not valid as a React child (found: object with keys {type, sound}).

I don't really understand this error as I am new to redux and react. Could somebody help me resolve this issue using the redux state and maybe explain to me why it is wrong. Thank you very much.

Here is a link to the code:

//link to codepen
https://codepen.io/roger1891/pen/LaYYaN

Answer 1

You are returning this.props.addSound() , which returns an action creator object with its only argument sound as the data. In this case the only argument you're passing in is mySoundList.localSoundList.map() . You may just need to remove that function...

return mySoundList.localSoundList.map((item) => {
      return (<div class="col-sm-4">
          <div id={item.btnId} class="btn btn-primary btn-sm drum-pad" onClick={this.clickButton} value={item.audioId}>
            {item.audioId}
            <audio id={item.audioId} class="clip" src={item.source} type={item.type}></audio>
          </div>
        </div>);                        
    });

Unless you're trying to do something asynchronously with the updated redux state from the ADD_Sound action?