vue点击按钮隐藏图片

您可以使用Vue的指令`v-on`和`v-if`来实现这个功能。首先，在您的Vue组件中，您可以添加一个按钮和一个图片元素，如下所示：

<template>
  <div>
    <button v-on:click="hideImage">隐藏图片</button>
    <img v-if="showImage" src="your-image-url">
  </div>
</template>

在上面的代码中，我们定义了一个按钮，并在按钮上添加了一个点击事件处理函数`hideImage`。我们还定义了一个图片元素，并使用Vue的条件指令`v-if`来控制它是否显示。

接下来，在您的Vue组件的`data`属性中，您需要添加一个名为`showImage`的布尔值。这个布尔值将用于控制图片元素的显示和隐藏。初始值应该为`true`，以便在页面加载时显示图片。

<script>
export default {
  data() {
    return {
      showImage: true
    }
  },
  methods: {
    hideImage() {
      this.showImage = false
    }
  }
}
</script>

在上面的代码中，我们在`data`属性中定义了`showImage`布尔值，并添加了一个名为`hideImage`的方法。当用户点击按钮时，该方法将会被调用并将`showImage`设置为`false`。这将导致图片元素被隐藏。

现在，当用户点击按钮时，图片将会被隐藏。您可以根据自己的需求来修改按钮和图片元素的样式。