写一份微信小程序代码点击不同按钮显示不同图片
时间: 2024-01-13 08:02:13 浏览: 72
好的,这个问题是关于编程的,我可以回答。以下是一份简单的微信小程序代码,可以根据不同按钮点击显示不同图片:
```
<view class="container">
<button bindtap="showImage1">按钮1</button>
<button bindtap="showImage2">按钮2</button>
<button bindtap="showImage3">按钮3</button>
<image wx:if="{{showImage1}}" src="https://example.com/image1.jpg"></image>
<image wx:if="{{showImage2}}" src="https://example.com/image2.jpg"></image>
<image wx:if="{{showImage3}}" src="https://example.com/image3.jpg"></image>
</view>
<script>
Page({
data: {
showImage1: false,
showImage2: false,
showImage3: false
},
showImage1: function() {
this.setData({
showImage1: true,
showImage2: false,
showImage3: false
})
},
showImage2: function() {
this.setData({
showImage1: false,
showImage2: true,
showImage3: false
})
},
showImage3: function() {
this.setData({
showImage1: false,
showImage2: false,
showImage3: true
})
}
})
</script>
```
这段代码定义了三个按钮和三个图片,当点击一个按钮时,对应的图片将显示出来,其他图片将隐藏。你可以根据自己的需要修改图片的地址和按钮的文本。希望这可以帮助到你。
阅读全文