v-watermarkit
v0.0.3
Published
Watermarkit directive for Vue2/3.
Downloads
9
Readme
Watermarkit
Watermarkit directive for Vue2/3.
Get Started
$ yarn add v-watermarkit
use globally
import { createApp } from 'vue'
import Watermark from 'v-watermarkit'
const app = createApp({/* ... */})
app.use(Watermark)
use in component
<script setup>
import { vWatermarkit } from 'v-watermarkit'
</script>
Usage
<template>
<div v-watermarkit="text"></div>
<!-- or -->
<div
v-watermarkit="{
text,
color: `#aaa`,
fontSize: 16,
zIndex: 999,
opacity: .3,
rotate: 30,
gap: 80,
}"
></div>
</template>
<script setup>
import { ref } from 'vue'
import { vWatermarkit } from 'v-watermarkit'
const text = ref(`大板栗 banli.co`)
</script>
ScreenShot
Api
|props | type | default |
| --- | --- | --- |
| text
| string
| ''
|
| color
| string
| #999
|
| fontSize
| number
| 12
|
| zIndex
| number
| 9999
|
| opacity
| number
| .1
|
| rotate
| number
| 15
|
| gap
| number
| 50
|
License
Licensed under the MIT License