当前位置: 首页> 教育> 高考 > 微信小程序 vant-weapp的 SwipeCell 滑动单元格 van-swipe-cell 滑动单元格不显示 和 样式问题 滑动后删除样式不显示

微信小程序 vant-weapp的 SwipeCell 滑动单元格 van-swipe-cell 滑动单元格不显示 和 样式问题 滑动后删除样式不显示

时间:2025/7/15 23:30:33来源:https://blog.csdn.net/weixin_44166849/article/details/140500587 浏览次数:0次

在微信小程序开发过程中 遇到个坑 此处引用 swipeCell 组件 刚开始是组件不显示 然后又遇到样式不生效

在这里插入图片描述

首先排除问题

  1. 是否在.json文件中引入了组件
{"usingComponents": {"van-swipe-cell": "@vant/weapp/swipe-cell/index","van-cell-group": "@vant/weapp/cell-group/index","van-cell": "@vant/weapp/cell/index",},"navigationBarTitleText": "收货地址"
}
  1. 是否在 wxml中引入了该组件
<van-swipe-cell right-width="{{ 65 }}" left-width="{{ 65 }}"><view slot="left" class="van-swipe-cell__left">选择</view><van-cell-group><van-cell title="单元格" value="内容" /></van-cell-group><view slot="right" class="van-swipe-cell__right">删除</view>
</van-swipe-cell>

排除了以上问题 swipeCell 显示了 但是 左右滑动 样式不对
在这里插入图片描述

解决办法

在 .scss 文件中 自己写样式吧

.van-swipe-cell__right {display: flex;justify-content: center;align-items: center;width: 130rpx;font-size: 30rpx;color: #fff;background-color: #f44;
}.van-swipe-cell__left {background-color: #07c160;
}

各位大佬 有没有其它解决办法 麻烦 留言指教下 拜托拜托!!

关键字:微信小程序 vant-weapp的 SwipeCell 滑动单元格 van-swipe-cell 滑动单元格不显示 和 样式问题 滑动后删除样式不显示

版权声明:

本网仅为发布的内容提供存储空间,不对发表、转载的内容提供任何形式的保证。凡本网注明“来源:XXX网络”的作品,均转载自其它媒体,著作权归作者所有,商业转载请联系作者获得授权,非商业转载请注明出处。

我们尊重并感谢每一位作者,均已注明文章来源和作者。如因作品内容、版权或其它问题,请及时与我们联系,联系邮箱:809451989@qq.com,投稿邮箱:809451989@qq.com

责任编辑: