VUE - NutUI

1.Nut-Swipe 组件滑动手势左右滑动时，整个页面也会一起滑动的问题

使用nut-swipe-group和外层增加 overflow-x: hidden 样式来解决这个问题

<div id="app" v-cloak>
    <div style="overflow-x: hidden;">
        <nut-swipe-group lock>
            <nut-swipe v-for="item in formUI.roleList" :name="item.RoleID">
                <nut-cell round-radius="0" class="row-cell">
                    <div class="row-div">
                        <nut-row>
                            <nut-col :span="8">
                                <div class="content">{{item.RoleName}}</div>
                            </nut-col>
                            <nut-col :span="8">
                                <div class="content">
                                    <span v-on:click="toWxUpdateRole(item.RoleID)">WX 权限设置</span>
                                </div>
                            </nut-col>
                            <nut-col :span="8">
                                <div class="content">
                                    <span v-on:click="toPcUpdateRole(item.RoleID)">PC 权限设置</span>
                                </div>
                            </nut-col>
                        </nut-row>
                    </div>
                </nut-cell>
                <template #right>
                    <nut-button shape="square" style="height: 100%" type="info" v-on:click="showUpdateRole(item.RoleID,item.RoleName)">修改</nut-button>
                    <nut-button shape="square" style="height: 100%" type="danger" v-on:click="deleteRole(item.RoleID)">删除</nut-button>
                </template>
            </nut-swipe>
        </nut-swipe-group>
    </div>

</div>

 

2.