Binding image :src with ref

welcome!
I am writing a small application that uses tensorflow. I would like the url of an image to change when a button is pressed.

const imageToDetect = ref("https://images.unsplash.com/photo-1561157437-415893bd7149");

and the img tag in template is:

<img
              :src="imageToDetect"
              ref="imageToDetect"
              crossorigin="anonymous"
              class="rounded-2xl"
              style="width: 90%"
            />
function changeImage() {
      console.log("Changed image.");
      imageToDetect.value = "https://images.unsplash.com/photo-1489824904134-891ab64532f1";
      console.log(imageToDetect.value);
    }

And now I have this problem. Binding :src does not work. It just doesn’t read url from imageToDetect ref. If I replace :src with regular src=“http://image_url…” everything is ok but then I will not be able to change the image address after pressing the button. Generally the application works but I would like to be able to change the image.

It seems like a bug where Vue doesn’t like the same element ref name as the composition APIs ref name.
Changing the img elements ref to something else seems to work.