lvwatermarks
Version:
vue2-水印插件
38 lines (31 loc) • 1.76 kB
Markdown
### 安装
```javascript
npm i lvwatermarks
import lvwatermarks from 'lvwatermarks'
Vue.use(lvwatermarks)
```
### 示例
```javascript
this.$watermark(this,'refname', {
watermarkText: '我的自定义水印',
angle: -30,
gap: 60,
fontSize: 18,
color: 'rgba(0, 0, 0, 0.3)',
verticalGap: 80,
layout:'diagonal'
});
```
+ 使用: 参数说明
### 参数说明
| 参数名称 | 类型 | 默认值 | 说明 |
|-----------------|-----------|--------------------------------|----------------------------------------|
| `this` | `Object` | 必填项 | 当前页面的 this，通常是 Vue 组件实例|
| `ref` | `String` | 必填项 | 目标元素的 `ref` 名称，用于指定水印容器 |
| `watermarkText` | `String` | `'默认水印'` | 水印文本内容 |
| `angle` | `Number` | `-20` | 水印文字的旋转角度（单位：度） |
| `gap` | `Number` | `50` | 水印文字之间的水平间距（单位：像素） |
| `fontSize` | `Number` | `20` | 水印文字的字体大小（单位：像素） |
| `color` | `String` | `'rgba(255, 255, 255, 0.5)'` | 水印文字的颜色 |
| `verticalGap` | `Number` | `70` | 水印文字之间的垂直间距（单位：像素） |
| `layout` | `String` | `排列形式：horizontal, vertical, diagonal`| 水印文字排列形式 |