我应该在哪里将ReactClick组件的onClick逻辑放在哪里？

Question

I have a component that is a button that opens a dialog.

const myComponent = () => <div><button>click me</button></div>

When the button is pressed I want the dialog to open.

Where should I position the onClick functionality (that will dispatch an action against the store to show the dialog)?

Should I use mapStateToProps to create a function on the props that will open the dialog, or is this overkill for such a small component?

Answer 1

It's depend on many aspects of your design:

Is it a common button component? Do you reuse your button some where else?

Then you should pass the onClick event and the caption of the button from props.

Is it a button that only dispatch a function to open the dialog? Is it used to open the dialog only?

Then you can handle that inside the component.

If it's used to dispatch an action to a store, then use mapDispatchToProps to map to the action to props.

In my opinions, no need to use store here unless you have that dialog accessible somewhere else.