How to call the reload method of an HttpImageSource

How-to Discussions
1

I have this list of images

<Each Items="{posters.portrait}" Limit="1">
    <Image Height="140" Width="103" StretchMode="UniformToFill" MemoryPolicy="QuickUnload">
        <HttpImageSource Density="1" Url="{xxsmall}" Policy="QuickUnload"/> 
    </Image>
</Each>

I want to reload the URL with “?randomText” to the end of the URL to make sure it makes a new request, I can use the onError perhaps.

Can someone provide an example for this?

2

You can add the ending ?randomText in JavaScript to the xxsmall argument. Will that not work for you?

3

Sure, I could do a function like

function random(s){
    return s + "?r=" + Math.random().toString().slice(2)
}

And maybe use it like:

<Each Items="{posters.portrait}" Limit="1">
    <Image Height="140" Width="103" StretchMode="UniformToFill" MemoryPolicy="QuickUnload">
        <HttpImageSource Density="1" Url="{random(xxsmall)}" Policy="QuickUnload"/> 
    </Image>
</Each>

My doubt is about how to call the “reload” method so it actually refreshes the image (I’m really new to fuse)

4

No, I mean wherever you generate the xxsmall value you can simply append a random string there. This is something your code must be doing, so you can change it when it first generates the string.

5

You’re saying that if I change the value of xxsmall, it will automatically refresh?

6

I don’t think I’m following what you want to do. Are you trying to provide a new URL to the items after they’ve first been created?

This is what Observable is for. So long as xxsmall is an Observable you can assign it a new value and it will load that new image.

https://www.fusetools.com/docs/fusejs/observable

If posters.portrait is an Observable list you could also replace the values in there (add/remove an item).

7

You’re right, it is an observable. I was just focused on trying to use the reload method I saw in the docs and forgot that it would just refresh on it’s own