当前位置: 首页 > 知识库问答 >
问题:

javascript - vue 有没有好用的水印插件推荐?

公胤运
2023-04-22

要求如下

  1. 支持文字水印
  2. 支持本地图片作为水印
  3. 支持本地图片+文字 作为水印
  4. 支持文字颜色/字体
  5. 支持水印宽高
  6. 支持水印显隐
  7. 支持水印透明度
  8. 支持水印渲染节点配置
  9. 支持水印在画布上绘制的水平和垂直偏移量

共有2个答案

西门骁
2023-04-22

https://www.zhangxinxu.com/wordpress/2017/05/canvas-picture-w...

傅正阳
2023-04-22
https://www.npmjs.com/package/watermark-dom
https://github.com/saucxs/watermark-dom
<template>
    <!-- App.vue 文件-->
    <div id="app">
        <router-view />
    </div>
</template>

<script>

// 安装文件,如果安装报错,可以用cnpm
// npm install watermark-dom --save
// npm install js-cookie --save

import watermark from 'watermark-dom'
import Cookies from 'js-cookie'

export default {
    name: "App",
    mounted(){
        setTimeout(()=>{

            // 在登录文件中,登录成功后,记得将用户名存到本地cookie中
            // Cookies.set('username',username);

            // 获取cookie中的username添加水印
            let username = Cookies.get('username');
            if(username){
                let now = new Date();
                let year = now.getFullYear();
                let month = now.getMonth()+1;
                let day = now.getDate();
                month = month<10?'0'+month:month;
                day = day<10?'0'+day:day;
                let date = year+'-'+month+'-'+day;
                watermark.load({ watermark_txt: username+','+date })
            }
        },1000)
    }
};
</script>
 类似资料:
  • 页面局部需要显示滚动条,需要鼠标移上去才显示滚动条,移出隐藏滚动条的效果,类似于simplebar-vue,但是该组件只支持 vue 2.7 以上版本,项目中目前 vue 2.6,请问有没有类似的组件推荐? 谢谢!

  • vue 有没有一款好用的录音组件? 支持录音数据上传、录音列表展示、录音播放、编辑回显录音等

  • 原生js插件,有哪些好的树形插件,可以实现类似企业微信树形机构成员的效果的。 支持搜索,自定义图标,可以显示成员头像。 类似如下:

  • 项目使用 vue 2.x 版本开发,需要做一个类似“连线”的功能,就是把页面上的一些 dom 节点连接起来,希望可以能够对连线做一些比较常见的操作,例如:线的颜色、样式、平滑度等。期间考虑了一些库,要不就收费,要不就感觉不够灵活,例如:无法连接 dom 节点,只能连接库中提供的一些简单的图形,但是之所以需要连接dom节点,就是考虑到html、css操作起来比较方便。 目前考虑过:JointJS、j

  • 大佬们,这个功能有没有合适的插件推荐: 1、底图图片支持缩放 2、可以在图片上加marker(图中的实心红色圆圈、黑色圆圈和绿色圆圈,颜色代表状态),也可以随着图片的缩放而缩放,但位置不能变 不知道应该怎么搜,希望有经验的小伙伴们推荐一个合适的插件