微信小程序——设置背景图片

最新推荐文章于 2025-05-27 09:30:36 发布

desongzhang

最新推荐文章于 2025-05-27 09:30:36 发布

阅读量1.2k

点赞数

CC 4.0 BY-SA版权

分类专栏：小程序文章标签：微信小程序前端

本文链接：https://blog.csdn.net/desongzhang/article/details/123209105

本文介绍了在微信小程序中如何为 vant 的 picker 组件设置背景图片。由于原组件仅支持文字，作者通过将图片转为 base64 编码，然后应用于确定按钮的背景，实现了添加图标或图片的需求。此外，还提到了微信小程序设置背景图的三种方式：网络图片、base64 和 image 标签。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

在这里插入图片描述
项目希望实现如上效果，
使用vant的picker组件
而源码是这样的：

  <view
    class="van-picker__cancel"
    hover-class="van-picker__cancel--hover"
    hover-stay-time="70"
    data-type="cancel"
    bindtap="emit"
  >
    {
   
   {
   
    cancelButtonText }}
  </view>
  <view wx:if="{
   
   { title }}" class="van-picker__title van-ellipsis"