在前端开发中，密码强度检查是一个非常常见的需求。而在 Polymer 项目中，拥有一个方便易用的密码强度检查组件也是非常重要的。此时，npm 包 polymer-password-strength 就可以为你提供帮助了。
什么是 polymer-password-strength?
polymer-password-strength 是一个基于 Polymer 2.0 开发的密码强度检查组件。它可以对输入框内的密码强度进行实时检查，并且根据不同强度显示相应的颜色标识。
现在，我们就一起来学习如何使用 polymer-password-strength 来加强你的 Polymer 项目密码安全性。
安装 polymer-password-strength
首先，需要通过 npm 来安装 polymer-password-strength：
npm install --save polymer-password-strength
这条命令会将 polymer-password-strength 包安装到你的项目目录中。
使用 polymer-password-strength
安装完成后，可以将 polymer-password-strength 作为一个依赖组件导入到需要使用的页面中。
<script type="module" src="/node_modules/polymer-password-strength/pwe-password-strength.js"></script>
接下来，我们需要在页面中添加一个 input 标签，并将 polymer-password-strength 作为该标签的 validator。
<input type="text" id="password" name="password" validator="password-strength" />
现在，你已经成功地将 polymer-password-strength 应用到了你的项目中。运行项目后，你会发现当输入框内的密码强度发生变化时，polymer-password-strength 组件也会做出相应的颜色标识变化。
polymer-password-strength 的属性和方法
polymere-password-strength 提供了多个属性和方法，可以帮助你进一步定制化你的密码强度检查需求。
属性
- maxPasswordLength： 默认值为 16，表示输入框中的最大密码长度。
- minPasswordLength：默认值为 6，表示输入框中的最小密码长度。
方法
- getStrength()： 获取当前密码的强度，返回值为字符串类型。
示例代码
下面是一段完整的使用 polymer-password-strength 的示例代码。
-- -------------------- ---- -------
--------- -----
------
------
------- ------------------------------------------------------------------------------------
-------
------
------- ------------- --------------------------------------------------------------------------------
-------
----- -
------ ------
------- -----
-------- ----
---------- -----
-------------- -----
-
------------------ -
------ ------
------- -----
-------------- -----
-
-------------- -
----------------- ----
-
---------------- -
----------------- -------
-
---------------- -
----------------- ------
-
--------
-----------------
------ ----------- ------------- --------------- ----------------------------- ------------------- --
---- --------------------------------
------- ---------------------------------------
--------
----- ------------- - ------------------------------------
----- ---------------- - ---------------------------------------------
--------------------------------------- ------------------
-------- ----------------------- -
-------------------------------------------------- ------------------ -------------------
----- -------- - ----------------------------
-------------------------------------------------------
-
-------- --------------- -
----- -------- - --------------------
----------------------------------------------------
-- --------- --- --------- -
----------------------------
- ---- -
----------------------
-
-
---------
-------
-------总结
polymer-password-strength 这个 npm 包可以帮助 Polymer 项目实现一键式的密码强度检查，并且非常灵活，可以满足定制化的需求。如果你的项目中还没有进行密码强度检查，那么 polymer-password-strength 是一个非常不错的选择，从中你也能学到更多的前端技巧。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60055ff381e8991b448ddbe2