vue2 点击按钮下载图片

在Vue 2中，你可以使用`<a>`标签结合JavaScript来实现点击按钮下载图片的功能。以下是一个简单的示例：

<template>
  <div>
    <button @click="downloadImage">下载图片</button>
    <img :src="imageUrl" alt="图片描述" />
  </div>
</template>

<script>
export default {
  data() {
    return {
      imageUrl: 'https://example.com/image.jpg', // 替换为你的图片URL
    };
  },
  methods: {
    downloadImage() {
      const link = document.createElement('a');
      link.href = this.imageUrl;
      link.download = 'image.jpg'; // 图片文件名，可自定义
      link.click();
    },
  },
};
</script>

在这个例子中，我们创建了一个`<button>`元素，当用户点击这个按钮时，会触发`downloadImage`方法。在这个方法里，我们首先创建了一个新的`<a>`元素，设置了它的`href`属性为图片URL，然后设置了`download`属性（下载文件的名字），最后模拟点击`link`，浏览器就会开始下载图片。