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

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

首先排除问题

  1. 是否在.json文件中引入了组件
javascript 复制代码
{
  "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中引入了该组件
javascript 复制代码
<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 文件中 自己写样式吧

javascript 复制代码
.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;
}

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

相关推荐
浩宇软件开发5 小时前
微信小程序实现自定义日历功能
微信小程序·小程序
Q_27437851095 小时前
springboot基于微信小程序的健康管理系统
spring boot·后端·微信小程序
V+zmm101348 小时前
教育培训微信小程序ssm+论文源码调试讲解
java·数据库·微信小程序·小程序·毕业设计
樊南8 小时前
【esp32-uniapp小程序】uniapp小程序篇02——Hbuilder利用git连接远程仓库
git·小程序·gitee·uni-app·hbuilder·torisegit
寰宇软件9 小时前
PHP校园助手系统小程序
小程序·vue·php·uniapp
陈钇钇10 小时前
持续升级《在线写python》小程序的功能,文章页增加一键复制功能,并自动去掉html标签
python·小程序·html
计算机-秋大田10 小时前
基于SSM的家庭记账本小程序设计与实现(LW+源码+讲解)
java·前端·后端·微信小程序·小程序·课程设计
大叔_爱编程11 小时前
wx036基于springboot+vue+uniapp的校园快递平台小程序
vue.js·spring boot·小程序·uni-app·毕业设计·源码·课程设计
van叶~15 小时前
Linux探秘坊-------4.进度条小程序
linux·运维·小程序
大叔_爱编程19 小时前
wx030基于springboot+vue+uniapp的养老院系统小程序
vue.js·spring boot·小程序·uni-app·毕业设计·源码·课程设计