feat: use PubSub Service with Web Component demo to subscribe instead of SlickEvent #859
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
An optional PubSub Service could be provided to SlickGrid and SlickDataView to use as a singleton PubSub to make it easier to subscribe to any event in 1 PubSub instance reference, this makes it a lot easier for Web Component based framework like Angular/React/Vue... For example, we can create a PubSub Service which uses JavaScript CustomEvent which we can then use it to send all events to our web component with all possible events (SlickGrid, DataView, plugins...) which is another alternative instead of having to
subscribe
to individual SlickEvent instances (grid, dataview, plugins, ...)For this to work we needed to apply the following changes in this PR
setPubSubService()
to SlickEventThe best example can be seen with Angular-Slickgrid Component and it is preferable for us to use CustomEvent as shown below via Component attributes like
(onClick)
and this is all achievable via a PubSub. For this to work, we use a JS CustomEvent based PubSub and we simply make the<my-component>
component tag as the target to receive all the events via CustomEventThis is the approach that we used for a while in Slickgrid-Universal, Angular-Slickgrid, ... Prior to this feature, what we were doing in Angular-Slickgrid was to loop through all SlickGrid/DataView events and
.subscribe
to every single SlickEvent and whenever a SlickEvent was calling.notify
, we were then redispatching as a CustomEvent to our web component to receive the final event. Basically this was pretty much acting as a middleware, this PR will simply remove the middleware need since providing a PubSub will also call its.publish()
method. We used the middleware approach for the past couple years and that worked but was not the most efficient way since we were subscribing for events that we may never use, however with this new feature it allows us to subscribe to only the events that we are interested in with a single PubSub instance (singleton) while still allowing SlickEvent notify/subscribe to work, so it is an optional additional feature and does not introduce any breaking change.TODOs
<my-component>
tag for a full demo of what this feature bringsunsubscribeAll()
when destroying the component