Package Exports

lm-mask

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (lm-mask) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

mask

作者：niuguimin
邮箱：15275151030@163.com
版本：**1.0.0**

介绍

mask蒙层

安装

lm-* 组件使用 npm 进行管理，命名空间统一为 lm-，请使用以下命令进行组件安装。

npm i lm-mask --save

如果你还没有安装 npm，可通过以下方式进行安装。
安装cnpm npm install -g cnpm --registry=https://registry.npm.taobao.org

使用

样例文档

待开发

使用

最少配置参数为：

传入内容
配置visible和opacity属性

<Mask 
    visible={ this.state.visible }

    opacity={3}

    onMaskClick={()=>this.setState({visible: false})}
>
    <div>This is content</div>
</Mask>

配置参数

Prop	Type	Default	Description
`visible`	`bool`	`undefined`	是否可见
`opacity`	`number`	`undefined`	透明度 0-1
`zIndex`	`number`	`999`	z-index属性
`onMaskClick`	`function`	`undefined`	点击回调

注意事项

mask外层包裹了lm-protal组件，默认append到body中。
可传入protal的参数，见配置参数后三属性
mask内组件需要阻止冒泡,否则会触发onMaskClick

开发调试

进入项目目录后，使用 node 命令启动服务

npm run start

打包发布可通过 node 命令执行

npm run build
npm publish

Changelog

0.1.0

init

0.1.2

modify animation name to solve style conflict

0.1.3

add zIndex prop & modify opacity prop

0.1.4

remove props time and timeCallback
optimize animation

0.1.5

just upgrade version

0.2.1

upgrade to React 16

0.2.2

bugfix for huawei mask scroll (by modify css3 animation)

0.2.3

forbid scroll when mask show

0.2.4

forbid scroll when mask show & relative bug fix

0.2.5

bugfix for mask scroll

0.2.7

update lm-portal for ssr

1.0.0

Update styles based on new UI

lm-mask