npm 包 milkui-mask 使用教程

阅读时长 2 分钟读完

在前端开发中,常常需要使用到遮罩层,用于提示用户当前操作正在进行中。而 milkui-mask 就是一个方便易用的 npm 包,可以快速实现遮罩层的功能。

安装

在使用 milkui-mask 之前,需要先安装它。在命令行中输入以下指令即可:

使用

安装完成后,我们就可以在项目中使用 milkui-mask。在 HTML 文件中添加一个 div,用于显示遮罩层:

接着,在 Javascript 文件中导入 milkui-mask 并创建实例:

这里的第一个参数是 CSS 选择器,用于指定要显示遮罩层的 div。

我们可以在需要显示遮罩层的时候,调用 mask.show() 方法展示遮罩层,再调用 mask.hide() 方法隐藏遮罩层。例如:

如果需要在展示遮罩层的时候添加文字提示,可以传入一个字符串作为参数:

默认情况下,遮罩层会使用半透明黑色作为背景色。如果需要更改背景色,可以传入一个 CSS 颜色值作为参数:

示例代码

-- -------------------- ---- -------
-- ---------- --
------ ---- ---- --------------

----- ---- - --- --------------
----- ------- - -------------------------------------

--------------- - ---------- -
  ----------------------
  ------------- -- -
    ------------
  -- ------
-

来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/60055a2181e8991b448d7c39

纠错
反馈