vue后台管理添加水印简单方式watermark-package

详情参考:https://www.npmjs.com/package/watermark-package

示例方法

bash 复制代码
  <el-button type="primary" @click="AddWatermark">添加水印</el-button>
 <el-button type="primary" @click="RemoveWatermark">清除水印</el-button>
bash 复制代码
const AddWatermark = () => {
  watermark.setWaterMark({
    w_texts: ['娃哈哈', '177****0000'],
    w_options: {
      w_width: 240,
      w_height: 140,
      w_top: '0px',
      w_left: '0px',
      w_rotateDeg: 25,
      w_font: '1.2rem Vedana',
      w_color: 'red',
      w_opacity: '0.2',
      w_zIndex: '100000'
    }
  })
}
const RemoveWatermark = () => {
  watermark.removeWatermark()
}
相关推荐
这里有鱼汤14 分钟前
Python 的 bisect 模块:这个冷门宝藏你用对了吗?
前端·后端·python
博览鸿蒙15 分钟前
FPGA设计职位介绍|如何成为一名合格的数字前端设计工程师?
前端·fpga开发
老胡说前端16 分钟前
JS 数组相同的key 进行合并
前端·javascript·vue.js
kovlistudio23 分钟前
红宝书第三十二讲:零基础学会模块打包器:Webpack、Parcel、Rollup
前端·javascript·webpack·node.js
天天进步201525 分钟前
Java全栈项目--校园快递管理与配送系统(5)
java·javascript·vue.js
这里有鱼汤26 分钟前
Python 跨平台路径处理:最优解来了!
前端·后端·python
SailingCoder27 分钟前
npm ERR! CXX(target) Release/obj.target/deasync/src/deasync.o
前端·npm·node.js
念九_ysl1 小时前
使用 Vue 快速集成 FullCalendar 日历组件教程
前端·javascript·vue.js
造夢先森1 小时前
SpringAI+MCP协议 实战
前端·javascript·easyui
Jyywww1211 小时前
Vue2+Vue3 45-90集学习笔记
vue.js·学习