更新记录

1.0.3（2025-09-26） 下载此版本

处理H5端水印重复加载的问题

1.0.2（2025-09-26） 下载此版本

处理引用页面重新加载后水印内容多次创建的问题

1.0.1（2025-09-22） 下载此版本

1.props无用参数删除 2.水印布局调整

平台兼容性

uni-app(3.6.5)

全局水印，内容可自定义，适用于APP和H5端，一次调用，全局展示

props参数说明

组件可调用方法说明

• 调用方法 this.$refs.detailEdit.createWaterMark([水印内容参数]);

水印内容参数详细说明

一般在项目首页调用，只需调用一次就可以在全局展示水印

页面引用实例代码

<template>
    <view>
        <waterMark ref="waterMark" :width="150" :height="100"></waterMark>
    </view>
</template>

<script>
    import waterMark from '@/components/waterMark/waterMark.vue';
    export default {
        components: {
            waterMark
        },
        data() {
            return {

            }
        },
        onReady() {
            var self = this;
            var data = [ {
                content: '../../static/111.png',  //相对路径
                x: 30,
                y: 15,
                width: 50,
                height: 50,
                type: 'image'
            },{
                content: '我是水印，哈哈哈',
                x: 0,
                y: 75,
                size: 15,
                type: 'text'
            }]
            setTimeout(function() {  //给组件一个加载缓冲时间
                self.$refs.waterMark.createWaterMark(data);
            }, 500)
        },
        methods: {

        }
    }
</script>

<style>

</style>