uniapp SwipAction滑动操作
文章描述：
uniapp中uni-swipe-action使用操作
uniapp uni-swipe-action在新的版本中用法发生了变化
template
<template>
<view class="container">
<uni-swipe-action>
<uni-swipe-action-item class="swipe-action-item" :right-options="options" @click="bindClick" @change="swipeChange($event, index)" v-for="(item,index) in 3">
<view class="item">item1</view>
</uni-swipe-action-item>
</uni-swipe-action>
</view>
</template>
script
export default{
data(){
return{
options:[
{
text: '取消',
style: {
backgroundColor: '#007aff',
color:'#fff'
}
}, {
text: '确认',
style: {
backgroundColor: '#dd524d'
}
}
],
}
},
methods:{
bindClick(e){
console.log('点击了'+(e.position === 'left' ? '左侧' : '右侧') + e.content.text + '按钮')
},
swipeChange(e,index){
console.log('当前状态：'+ e +'，下标：' + index)
}
}
}style
<style lang="scss">
page{
background: #fff;
}
.container{
box-sizing: border-box;
padding: 0 20upx;
}
.swipe-action-item{
border-bottom: 1upx solid #eee;
display: block;
padding: 20upx 0;
margin-bottom: 20upx;
.item{
color: #00AEBE;
padding-left: 20upx;
}
}
</style>新版本问题
在点击的时候会出现 isPC is not defined错误！
解决方法
找到项目路径/uni_modules/uni-swipe-action/components/uni-swipe-action-item/mpwxs.js”文件里，把
// #ifdef H5
import {
isPC
} from "./isPC"
// #endif删除，然后把这个文件的所有的改成
let isPC=function(){return false}
发布时间：2022/06/16
发表评论