uni-swipe-action如何结合uni-table、uni-tr、uni-td使用？

分类：uni-app

如题，想在uni-table里使用uni-swipe-action，每一行都可加一个左滑动，可以操作每行数据。这个需求用uview的u-table系列及u-swipe-action可以实现，但是在uni里无法实现
存在各种问题：

<uni-table :border="true" :stripe="true">  
                <uni-tr>  
                    <uni-th v-for="(c,cx) in columns" :key="c.key" width="150rpx">{{c.name}}</uni-th>  
                </uni-tr>  
<uni-swipe-action v-for="(item, index) in tableData" :key="item.STCD">  
                        <uni-swipe-action-item :show="item.show" @click="click" @change="open"    
                        :right-options="item.STATUS == '停用' ? options : soptions">   
                        <uni-tr >  
                                        <uni-td v-for="(i,x) in columns" :index="x" width="150rpx">  
                                            <view class="viewtxt">  
                                                <textarea class="viewtxt__input viewtxt__textarea" :disabled="true" :auto-height="true" v-model="i.key == 'ONLINESTATE' ? (item[i.key] == 1 ? '在线' : '不在线') : item[i.key]"/>  
                                            </view>  
                                        </uni-td>  
                             </uni-tr>  
                        </uni-swipe-action-item>  
                    </uni-swipe-action>   
</uni-table>

2021-01-15 10:06 负责人:无分享

5 个回复

m***@foxmail.com (作者) - jiang

uview的那套方案在app没问题，效果挺好，问题在小程序上会卡死，所以想用uni的实现，结果实现不了

m***@foxmail.com (作者) - jiang

这是uview的实现方式

<u-table :border="true" :stripe="true">  
                <u-tr>  
                    <u-th v-for="(c,cx) in columns" :key="c.key" width="150rpx">{{c.name}}</u-th>  
                </u-tr>  

                <u-swipe-action :show="item.show" btn-width="130" :index="index" v-for="(item, index) in tableData" :key="item.STCD"  
                 @click="click" @open="open" :options="item.STATUS == '停用' ? options : soptions">  
                                        <u-td v-for="(i,x) in columns" :index="x" width="150rpx">  
                                            <view class="viewtxt">  
                                                <textarea class="viewtxt__input viewtxt__textarea" :disabled="true" :auto-height="true" v-model="i.key == 'ONLINESTATE' ? (item[i.key] == 1 ? '在线' : '不在线') : item[i.key]"/>  
                                            </view>  
                                        </u-td>  
                             </u-tr>  
                </u-swipe-action>  
            </u-table>

m***@foxmail.com (作者) - jiang

我发现其实就是u-swipe-action导致的卡顿，问题是uni-swipe-action结合uview的u-table这一套也没法用啊。。

m***@foxmail.com (作者) - jiang

如图，uni-swipe-action结合uview的utable系列组件，渲染异常

DCloud_UNI_HT

现在还不支持嵌套使用，因为组件渲染需要动态获取组件节点属性，可能会导致组件渲染异常

m***@foxmail.com (作者)

uview的uswipeaction支持嵌套操作，可以搭配utable使用，但是在小程序上性能很差

2021-01-15 16:39
m***@foxmail.com (作者)

如果不支持的话，我只能放弃修改了，还是有uview的那一套，性能上的问题目前无法优化

2021-01-15 16:48
DCloud_UNI_HT

回复 m***@foxmail.com: 目前是没有太好的办法，只能选择一个相对来说最优的解决方案了

2021-02-18 11:04

该问题目前已经被锁定, 无法添加新回复

uni-swipe-action如何结合uni-table、uni-tr、uni-td使用？

5 个回复

公告

相关问题

uni-swipe-action如何结合uni-table、uni-tr、uni-td使用？

与内容相关的链接

5 个回复

公告

相关问题