微信小程序> 微信小程序wepy框架入门教程向左滑动删除效果(三)

微信小程序wepy框架入门教程向左滑动删除效果(三)

浏览量:543 时间: 来源:祈澈菇凉

文档

  • wepy快速指南
  • 小程序框架wepy开发文档
  • wepy开源
  • wepy官方文档
  • 微信小程序wepy框架资源汇总

1:使用微信小程序框架wepy - 滑动删除插件
用命令安装

 npm install wepy-swipe-delete --save或者 cnpm install wepy-swipe-delete --save
小程序

2:在WebStorm里面打开初始化生成的项目
编写index.wpy界面的代码
以下代码来自插件 (复制过来即可使用)

template  repeat for="{{list}}" key="index" index="index" item="item"    swipeDelete :swipeData="item" @delItem.user="handleDelItem"      view class="swipe-title"        {{item.title}}      /view    /swipeDelete  /repeat/templatescript  import wepy from 'wepy'  import swipeDelete from 'wepy-swipe-delete'  export default class Index extends wepy.page {    components = {      swipeDelete    }    data = {      list: [        {id: 1, title: '标题1', style: 0},        {id: 2, title: '标题2', style: 0}      ]    }    methods = {      handleDelItem (itemData) {        console.log(itemData)      }    }  }/script
小程序

3:运行编译
wepy build --watch


小程序

4:
打开微信开发者工具查看效果


小程序

原文作者:祈澈姑娘 技术博客:https://www.jianshu.com/u/05f416aefbe1
90后前端妹子,爱编程,爱运营,文艺与代码齐飞,魅力与智慧共存的程序媛一枚。
坚持总结工作中遇到的技术问题,坚持记录工作中所所思所见,对于博客上面有不会的问题,可以加入qq技术交流群聊:649040560。

版权声明

即速应用倡导尊重与保护知识产权。如发现本站文章存在版权问题,烦请提供版权疑问、身份证明、版权证明、联系方式等发邮件至197452366@qq.com ,我们将及时处理。本站文章仅作分享交流用途,作者观点不等同于即速应用观点。用户与作者的任何交易与本站无关,请知悉。

产品经理

手机 : 13312967497

擅长 : 小程序流量变现

扫码领取礼包

最新资讯

热门模板

  • 头条
  • 搜狐
  • 微博
  • 百家
  • 一点资讯
  • 知乎