Closed fjwong closed 3 years ago
Hi,
Rather than hooking this into QImg, why not use other (and better) strategies, like:
@rstoenescu Thank you for the response.
Apologies for not mentioning this before. I thought of doing it that way first, but the problem I had with this is that the UI would end up showing two spinners, one during the API request, and the one shown by QImg when actually loading the image, making the animation seem to flicker during the process.
I have prepared a Codepen that better shows the issue: https://codepen.io/fjwong/pen/XWpOPOw
Some points to consider:
no-default-spinner
, but then I get a blank image after the first animation until the image finishes loading.By setting QImg's isLoading
data property via refs
as I mentioned before, I can get a single animation sequence:
https://codepen.io/fjwong/pen/WNRPadm
Is your feature request related to a problem? Please describe. I have an application that fetches data from an API. The API response contains, among other things, the URL of an image associated with the requested object, and we use QImg to display it in our UI.
The problem is that, I'd like to show QImg's loading spinner while waiting for the API request to finish, but there's no straightforward way to activate/deactivate it manually.
Describe the solution you'd like It'd be great if QImg supported a
loading
prop similar to QBtn, and show the spinner whenloading
is true or while the image is loading as it is now.Alternatively, allowing QImg's
src
prop to also support promises that resolve to strings would serve to this purpose, but thought that setting the loading state manually would perhaps be easier to implement and serve for a variety of cases.Describe alternatives you've considered At the moment I can more or less achieve what I need by doing the following:
but I'd rather not do it this way, since it's tied to how QImg works internally.
Please let me know if there's perhaps a better way to do this with current functionality.