vue-promised
vue-promised copied to clipboard
Component Events
What problem is this solving
Currently there is no way without using a watcher to invoke a function upon promise resolution or rejection. In the app I'm working on we use notifications when something goes wrong. I can't invoke the notification service from the template.
Proposed solution
Emit @resolved and @rejected events from the promised component when the promise is resolved or rejected.
Example Usage
<promised :promise="makeApiCall()" @rejected="hdlRejected">
<!-- Some UI Code here -->
</promised
I think this could be very useful for observability and better error handling (such as tentatively recovering from errors)
Your solution looks good, and I believe it would be the best solution in most cases.
As a workaround, would getting the Promise in the script and using it directly work? This doesn't require watchers.
E.g. for the case you outlined above:
const apiCallPromise = ref(makeApiCall())
apiCallPromise.value.catch(
(reason) => hdlRejected(reason)
)
<promised :promise="apiCallPromise">
<!-- Some UI Code here -->
</promised
This is exactly my use-case.
The workaround proposed by @darrylnoakes is on point (thanks), but the proposed API is obviously more elegant and clean.