该组件的ui参照了招商银行app的手势登录设置和手势登录验证页面，用canvas实现了设置手势密码的功能和验证手势密码的功能，绘制手势时按顺序记录所有经过的九宫格的点，作为手势密码。 （1）密码小于4位。提示'至少连接4个点，请重新绘制'，且清空所有九宫格； （2）密码大于4位…

Vue移动端创建项目，使用rem适配。引入Vant UI组件后，发现Picker的高度在安卓是正常的, iOS变的只有原来的一半, 后面发现是Vant组件中Picker的单位只能使用px, 使用dpr变化后导致的。 在index.html加入一句禁止缩放解决的。 使用Toast…

BetterScroll 日常有许多业务代码，会要求实现滚动功能，比如某东的商城 这样的效果不难，但是用原生的overflow:hidden实现不了灵动的效果，所以引入了一款插件better-scro

简单的一句概括就是： **flexible.js帮我们计算出1rem 等于多少px**。 怎么计算的？ **很简单，就是1rem = 屏幕宽度的1/10**

在今天这篇文章中，我并不会在这里讲一些移动端视口的概念，包括物理像素和逻辑像素，理想视口，dpr等等等等，我只介绍这样一种非常不错的移动端适配方案：post-css-to-viewport，如果我说这种方案能解决98%以上的移动端布局痛点，我想整个掘金，应该没有人会反驳。 这种…

使用 postcss-px-to-viewport 插件将px自动转为vw的移动端适配方案 github地址：postcss-px-to-viewport 插件安装 参数配置 postcss.conf

在此之前为解决适配问题“普遍”会给html根节点设置font-size作为根字体计算单位值，适兼容多端配问题。开发者需要实时换算单位、还需要精确到六七位小数点。这样的解决方案在现在看来似乎不是最简洁高

1如果需要使用 rem 单位进行适配，推荐使用以下两个工具： postcss-pxtorem，是一款 PostCSS 插件，用于将 px 单位转化为 rem 单位 amfe-flexible，用于设置