0.0.5 • Published 6 years ago

gz-popup v0.0.5

Weekly downloads
-
License
ISC
Repository
-
Last release
6 years ago

gz-popup

一个简单自用的弹窗插件

经过上一个弹窗插件在项目中的应用,我发现我的插件有一个很致命的问题————应用场景过窄,只能用于选择确认和取消的情况。假如需要弹窗中显示表单或者特定内容,则无法完成。因此在新项目中改用新的方法。

1.下载

npm install --save-dev gz-popup

2.组件使用

需使用js.use()引入

import GzPopup from 'gz-popup'

Vue.use(GzPopup,{
  limitWidth:980,
  smWidth:70
})

在组件中使用

<gz-popup v-model="isShow" w="800" h="200">
 <button type="button" name="button" @click="openMaskLayer">取消</button>
</gz-popup>

3.参数设置

全局设置

(1) limitWidth:

边界宽度(小于此宽度算作移动端),默认值为750(px)

(2) smWidth:

移动端弹窗宽度(注意此处为百分比),默认值为80(%)。如果所设置的弹窗宽度比移动端界面宽度小,则按原尺寸显示,并不会按照此数值显示

组件中设置

(1) show:

是否显示,只能传入Boolean类型。

(2) w:

弹窗宽度,默认值为200(px),窗口宽度在750px以下时变为80%

(3) h:

弹窗高度,默认值为200(px)

0.0.5

6 years ago

0.0.3

6 years ago

0.0.4

6 years ago

0.0.2

6 years ago

0.0.1

6 years ago