4 ms·
Great question! Actions should be thought of as a mapping between some mechanical UI event (typing in a form, clicking on a button) and an event with some meani
by straws 11y ago
Great question! Actions should be thought of as a mapping between some mechanical UI event (typing in a form, clicking on a button) and an event with some meaning in your application ("user typed a hacker news comment", "user submitted a reply to this comment with this text"). Whatever your application data store abstraction is, it should be responsible for taking that meaningful event and figuring out what to do with it (check to see that the message isn't empty, check to see that the comment was persisted to the server).
Actions describe things that happened in the world and the role of your store is to figure out if that thing that happened is valid or not, and pass the necessary data to components listening for changes.
- pbowyer 11y agoThanks for your explanation, that makes sense theoretically but... could you provide a code example for how this breaks out in practice?
- yblu 11y agoI guess what s/he meant was having something like this in the store: handleComment(comment) { if (comment === '') this.dispatch('comment-error', 'empty') else svc.send(comment) .then(() => this.dispatch('comment-success') .catch(err => this.dispatch('comment-error', err)) } The view/controller (or whatever it's called in React) will then listen to the events and set its state accordingly so that the UI can be re-rendered. It does look quite complicated compared with typical error handling code. Not sure if I misunderstood something or whether this additional layer of message dispatching is worthwhile in most apps.