uview-ui组件swipeAction关闭无法生效解决方案

简介: uview-ui组件swipeAction关闭无法生效解决方案

uview-ui组件swipeAction关闭无法生效解决方案

在使用swipeAction滑动块的时候点击删除无法关闭选项,

u-swipe-action组件源代码

watch: {
  show: {
    immediate: true,
    handler(nVal, oVal) {
      if (nVal) {
        this.open();
      } else {
        this.close();
      }
    }
  }
}

是用watch监听属性改变才能触发,所以在打开选项触发open函数必须设置为true

  1. 在对data中的数组或对象进行修改时候,有些操作是非响应式的,vue检测不到数据更新,此时就需要使用this.$set进行响应式的数据更新
  2. watch中添加“deep:true”来实现对对象的属性变化的深度监听,对于数组的对象,此方法会失效

解决方案

// 打开
open(index) {
  this.validList[index].show = true;
  this.$set(this.validList, index, this.validList[index]);
},
// 关闭
close(index) {
  this.validList[index].show = false;
  this.$set(this.validList, index, this.validList[index]);
}


相关文章
|
24天前
|
JavaScript 前端开发
如何优雅的只在当前页面中覆盖ui库中组件的样式(vue的问题)
如何优雅的只在当前页面中覆盖ui库中组件的样式(vue的问题)
15 0
如何优雅的只在当前页面中覆盖ui库中组件的样式(vue的问题)
|
1月前
|
搜索推荐 BI 开发者
sap.ui.comp.smarttable.SmartTable 组件 beforeRebindTable 事件的用法
sap.ui.comp.smarttable.SmartTable 组件 beforeRebindTable 事件的用法
22 0
|
3月前
|
开发框架 前端开发 .NET
七天.NET 8操作SQLite入门到实战 - (1)第七天BootstrapBlazor UI组件库引入
七天.NET 8操作SQLite入门到实战 - (1)第七天BootstrapBlazor UI组件库引入
|
3月前
|
JavaScript 前端开发 API
面试官:ui组件可以自动加载,那么业务组件可以吗?
面试官:ui组件可以自动加载,那么业务组件可以吗?
|
3月前
|
设计模式 前端开发 数据可视化
【第4期】一文了解React UI 组件库
【第4期】一文了解React UI 组件库
105 0
|
2月前
|
资源调度 JavaScript
Vue + Element-ui组件上传图片报错问题解决方案
Vue + Element-ui组件上传图片报错问题解决方案
|
3月前
|
前端开发
element-ui组件DatePicker日期选择器移动端兼容
element-ui组件DatePicker日期选择器移动端兼容
element-ui组件DatePicker日期选择器移动端兼容
|
3月前
|
JSON Java 数据库
基于uniapp原生组件uni-ui 做一个登录注册与个人中心(后端篇)
基于uniapp原生组件uni-ui 做一个登录注册与个人中心(后端篇)
112 2
|
3月前
|
搜索推荐 C# 开发者
3个值得推荐的WPF UI组件库
3个值得推荐的WPF UI组件库
154 0
|
3月前
|
前端开发 JavaScript C#
10款值得推荐的Blazor UI组件库
10款值得推荐的Blazor UI组件库
136 0

热门文章

最新文章