Num.1 :  链接 向右滑动, 显示删除按钮,  根据touchStart touchEnd 的 clientX 差距 > 30; 说明是向左滑动, 显示;

改变 e.currentTarget.parentElement.dataset.type  (还有这种操作)       data -type = 1,

通过css显示 删除按钮, li [data-type=1]{ transform: translate3d(-2rem,0,0) }

这个体验感觉不是很好, 在用户滑动完之后, 才显示按钮

Num.2 : 链接

vue 手写组件 集合的更多相关文章

  1. 基于vue手写tree插件那点事

    目录 iview提供的控件 手写控件 手写控件扩展 手写控件总结 # 加入战队 微信公众号 主题 Tree树形控件在前端开发中必不可少,对于数据的展示现在网站大都采取树形展示.因为大数据全部展示出来对 ...

  2. Vue自己写组件——Demo详细步骤

    公司近期发力,同时开了四五个大项目,并且都是用Vue来做的,我很荣幸的被分到了写项目公用模块的组,所以需要将公用的部分提取成组件的形式,供几个项目共同使用,下面详细讲一下写Vue组件的具体步骤. 一. ...

  3. vue如何写组件（script标签引入的方式）

    很多人知道.vue结构的单文件组件形式,不过这种单文件组件的结构如果要加入到现有的jquery项目中就比较麻烦了,那如果我们又想用vue来写模板,又不想引入vue-cli管理,那该怎么来写组件呢?别着 ...

  4. vue 自己写组件。

    最近在网上看到很多大神都有写博客的习惯,坚持写博客不但可以为自己的平时的学习做好记录积累 无意之中也学还能帮助到一些其他的朋友所以今天我也注册一个账号记录一下学习的点滴!当然本人能力实在有限写出的文章 ...

  5. vue手写的轮播图片，解决已经修改data中的值，页面标签已绑定，但页面没效果

    1.效果 2.index.html <!DOCTYPE html> <html lang="en"> <link> <meta chars ...

  6. vue手写轮播

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  7. vue 手写倒计时，样式需要自己调。（ 亲测可用，就是没有样式 ）

    先写一个 js 文件,这个文件是工具类文件,需要单独开一个js // 计算出时间戳的具体数据:比如将85400转化为 n天n时n分n秒 export function formateTimeStamp ...

  8. 基于Vue手写一个下拉刷新

    当然不乏有很多下拉刷新的插件可以直接使用,但是自定义程度不强,大部分都只能改改文字,很难满足设计师的创意,譬如淘宝和京东首页那种效果,就需要自己花心思倒腾了,最近刚好有这种需求,做完了稍微总结一下,具 ...

  9. (一)LinkedList集合解析及手写集合

    一.LinkedList集合特点 问题 结      论 LinkedList是否允许空 允许 LinkedList是否允许重复数据 允许 LinkedList是否有序 有序 LinkedList是否 ...

随机推荐

  1. 微信小程序选择图片，查看图片信息，浏览图片，图片上传

    依次点击链接请查看以下步骤 选择图片: https://mp.weixin.qq.com/debug/wxadoc/dev/api/media-picture.html#wxchooseimageob ...

  2. xml的解构与组装

    xml的结构 <xml> <ToUserName><![CDATA[%s]]></ToUserName> <FromUserName>< ...

  3. 焦作网赛-G-欧拉降幂

    https://nanti.jisuanke.com/t/31716 答案就是2^(n-1)%mod ,n非常的大,由欧拉降幂公式    AB%C=AB%phi(C)+phi(C)%C  化简 2n- ...

  4. WDA基础十三：常用模板管理

    常用的模板一般是SMW0和OAOR,根据不同需求来的. WAD有个不好的地方就是不支持GUI上的OLE和DOI,所以需要做转换,下面是常用的方式: FUNCTION ZCRM_DOWNLOAD_TEM ...

  5. Oracle 11.2.0.4下载地址

    Linux x86: https://updates.oracle.com/Orion/Services/download/p13390677_112040_LINUX_1of7.zip?aru=16 ...

  6. 产品经理-visio

    产品经理在 visio 基本上就使用 4 种图: 基本流程图.跨职能流程图.UML活动图 以及 UML序列图. 其中,UML序列图是使用最少的.(UML序列图一般是给技术研发人员看的,产品新人可以先不 ...

  7. docker实战系列之docker 端口映射错误解决方法

    错误: Error response from daemon: Cannot start container web: iptables failed: iptables -t nat -A DOCK ...

  8. 牛客多校第三场 A—pacm team （4维背包加路径压缩）

    链接:https://www.nowcoder.com/acm/contest/141/A 来源:牛客网 Eddy was a contestant participating , Eddy fail ...

  9. Linux安装/卸载软件教程

    一.源码安装 ./configure #环境检查.生成makefile make #编译 make install #安装 这三条命令是最经典的Linux软件安装,适用于所有发行版 二.软件包管理工具 ...

  10. 把旧系统迁移到.Net Core 2.0 日记 (16) --Cors跨域访问

    IE浏览器的Intranet局域网设置默认是可以跨域访问的.chrome就不可以. 这里说的跨域是指javascript代码不能跨域, 当然你在后端controller代码里用HttpClient.G ...