uni-app 在unicloud-db下使用SwipeAction没有反应

uni-app 在unicloud-db下使用SwipeAction没有反应

开发环境 版本号 项目创建方式
Mac 11.2.3 HBuilderX
HBuilderX 3.1.4
第三方开发者工具 1.05.2103122
基础库 2.15.0

操作步骤:

<unicloud-db ref="udb" v-slot:default="{data, pagination, loading, hasMore, error}"  
        collection="work-log,project" field="times,status,type,project{title}" :where="listWhere">  
        <view v-if="error">{{error.message}}</view>  
        <uni-swipe-action>  
            <uni-swipe-action-item :right-options="options">  
                <view class="content-box">  
                    <text class="content-text">使用数据填充</text>  
                </view>  
            </uni-swipe-action-item>  
        </uni-swipe-action>  
</unicloud-db>
`

更多关于uni-app 在unicloud-db下使用SwipeAction没有反应的实战教程也可以访问 https://www.itying.com/category-93-b0.html

3 回复

+1 ,也遇到这个问题了。1年多了没人管

更多关于uni-app 在unicloud-db下使用SwipeAction没有反应的实战教程也可以访问 https://www.itying.com/category-93-b0.html


unicloud-db 组件作用域插槽缺少 options,或者先去掉绑定的options试试是否正常

unicloud-db 组件中使用 uni-swipe-action 时,需要确保滑动操作组件正确绑定到数据源。从你的代码看,uni-swipe-actionuni-swipe-action-item 没有与 unicloud-db 返回的 data 进行动态绑定,导致组件无法响应数据变化。

以下是修改建议:

  1. uni-swipe-action 移到 v-for 循环中,确保每个列表项都有独立的滑动操作:

    <unicloud-db ref="udb" v-slot:default="{data, pagination, loading, hasMore, error}"  
            collection="work-log,project" field="times,status,type,project{title}" :where="listWhere">  
            <view v-if="error">{{error.message}}</view>  
            <uni-swipe-action v-for="(item, index) in data" :key="index">  
                <uni-swipe-action-item :right-options="options" @click="onClick">  
                    <view class="content-box">  
                        <text class="content-text">{{ item.project.title }}</text>  
                    </view>  
                </uni-swipe-action-item>  
            </uni-swipe-action>  
    </unicloud-db>
    
  2. 检查 options 配置:确保 optionsdata 中正确定义,例如:

    data() {
      return {
        options: [
          {
            text: '删除',
            style: { backgroundColor: '#dd524d' }
          }
        ]
      }
    }
回到顶部