后台response输出流前端动态加载数据问题

自己做一个小项目玩时，后台用response输出流生成二维码，前端需要根据输出流直接显示图片。简单的方式是将接口地址赋给img的src属性，但是在这样写死的情况下如何做到刷新二维码的功能。

解决方案：加入时间戳

<img :src="`http://localhost:8080/api/team/share?teamId=${teamId}&timestamp=${new Date().getTime()}`"
        @click="refresh" />

通过加入时间戳，重新渲染时向接口重新发送请求。并通过点击事件，实现了二维码刷新功能。

问题：关闭窗口时二维码无效生成

img通常嵌套在dialog中，注意部分组件库如vant，控制dialog关闭的事件实际是控制dom元素的销毁与创建。在dialog关闭时会再次发起请求生成无效二维码。并且其组件貌似不支持v-show指令，不能向上图直接将请求置于src后。

解决方案：ref

<van-dialog v-model:show="showPicture" title="入队二维码">
    <template #default>
      <img :src="link" @click="refresh" />
      <h4 style="text-align:center;color:coral ">点击图片刷新</h4>
    </template>
  </van-dialog>
  ...
  const link = ref('')
  const share = async (team) => {
  teamId.value = team.id;
  link.value = `http://localhost:8080/api/team/share?teamId=${teamId.value}&timestamp=${new Date().getTime()}`
  showPicture.value = !showPicture.value;
}

问题解决，仅供参考，具体细节及后台代码优化需实现