介绍
groupcenter-modal-coberturas-frontend 是一款基于 Vue.js 的组件库，用于创建各种弹窗模态框。该组件库提供了多种弹窗模态框，包括标准弹窗、确认弹窗、警告弹窗等等。用户可以根据自己的需求快速创建一个美观、易用的弹窗模态框。
安装
$ npm install groupcenter-modal-coberturas-frontend
引入
import Vue from 'vue' import GroupcenterModalCoberturasFrontend from 'groupcenter-modal-coberturas-frontend' Vue.use(GroupcenterModalCoberturasFrontend)
使用
标准弹窗
-- -------------------- ---- -------
----------
-----
------- ------------------ - -------------------
------------------ ---------------------
---------------
----
--------------
----
------- ------------------ - ------------------
--------------------
------
-----------
--------
------ ------- -
------ -
------ -
----------- -----
-
-
-
---------确认弹窗
-- -------------------- ---- -------
----------
-----
------- ------------------ - -----------------
-------------------- ---------------------
------------
-------------------
----------------------
------
-----------
--------
------ ------- -
------ -
------ -
----------- -----
-
-
-
---------警告弹窗
-- -------------------- ---- -------
----------
-----
------- ------------------ - -----------------
------------------ ---------------------
-----------
----------------------
--------------------
------
-----------
--------
------ ------- -
------ -
------ -
----------- -----
-
-
-
---------API
groupcenter-modal
| 参数 | 说明 | 类型 | 可选值 | 默认值 |
|---|---|---|---|---|
| value | 控制弹窗的显示与隐藏 | Boolean | — | false |
| title | 弹窗标题 | String | — | 弹窗 |
| width | 弹窗宽度 | String | — | 50% |
| cancel-text | 取消按钮文本 | String | — | 取消 |
| confirm-text | 确认按钮文本 | String | — | 确认 |
| show-confirm-button | 是否显示确认按钮 | Boolean | — | true |
| show-cancel-button | 是否显示取消按钮 | Boolean | — | true |
groupcenter-confirm
| 参数 | 说明 | 类型 | 可选值 | 默认值 |
|---|---|---|---|---|
| value | 控制弹窗的显示与隐藏 | Boolean | — | false |
| title | 弹窗标题 | String | — | 请确认 |
| width | 弹窗宽度 | String | — | 30% |
| cancel-text | 取消按钮文本 | String | — | 取消 |
| confirm-text | 确认按钮文本 | String | — | 确认 |
groupcenter-alert
| 参数 | 说明 | 类型 | 可选值 | 默认值 |
|---|---|---|---|---|
| value | 控制弹窗的显示与隐藏 | Boolean | — | false |
| title | 弹窗标题 | String | — | 警告 |
| width | 弹窗宽度 | String | — | 30% |
| confirm-text | 确认按钮文本 | String | — | 确认 |
总结
groupcenter-modal-coberturas-frontend 是一款功能强大、易用、美观的组件库，可以轻松地创建各种弹窗模态框。本文详细地介绍了该组件库的安装、引入和使用方法，并给出了三个具体的示例。希望本文能够对前端开发工作提供帮助和指导。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6005672481e8991b448e39bc