fes.js/docs/reference/plugin/plugins/watermark.md
ocean_gao 70b034a351
feat: plugin-watermark 提供 destroyWatermark (#124)
* feat: 水印支持动态关闭和打开

* refactor: watermark代码规范

* feat: 水印关闭逻辑优化

* fix: watermark 导出 destroyWatermark

* refactor: 代码规范

* feat: 水印性能优化

* refactor: 代码规范

* refactor: 代码规范

* fix: 重新渲染水印
2022-05-11 10:32:44 +08:00

1.2 KiB
Raw Blame History

@fesjs/plugin-watermark

介绍

给页面添加水印效果

启用方式

package.json 中引入依赖:

{
    "dependencies": {
        "@fesjs/fes": "^2.0.0",
        "@fesjs/plugin-watermark": "^2.0.0"
    }
}

编译时配置

export default {
    watermark: {
        disabled: false
    },
}

disabled

是否禁用水印,默认是false

可以在开发环境关闭水印:

export default {
    watermark: {
        disabled: true
    },
}

API

createWatermark

创建水印功能,通过 @fesjs/fes 导入 API

import { createWatermark, destroyWatermark } from '@fesjs/fes';

createWatermark({ content: '我是水印' }); // 生成水印
destroyWatermark(); // 销毁水印

默认参数是:

{
    content = '请勿外传',
    container = document.body,
    width = 300,
    height = 300,
    textAlign = 'center',
    textBaseline = 'middle',
    fontSize = '14px',
    fontFamily = 'Microsoft Yahei',
    fillStyle = 'rgba(184, 184, 184, 0.3)',
    rotate = 25,
    zIndex = 99999,
    timestamp = 'YYYY-MM-DD HH:mm'
}

如果不需要时间戳,则可以设置timestampfalse