uni-app，微信小程序实现全局水印

先在compontents里面写个全局组件

<template>
    <view class="water_top" style="pointer-events: none;">
        <view class="water-text" v-for="i in 20" :key="i">{{ watermarkText }}</view>
    </view>
</template>

<script>
export default {
    name: 'WaterMark',
    data() {
        return {};
    },
    computed: {
        watermarkText() {
            return '2021-12-28';
        }
    }
};
</script>

<style lang="scss" scoped>
    /* 想要改水印大小或者稀疏通过样式调整即可 */
    .water_top{
      position: fixed;
      width: 200vw;
      top:0;
      bottom: 0;
      left: 0;
      right: 0;
      transform:rotate(-10deg);
      z-index: 1;
    }
    .water-text{
      float: left;
      padding: 0 50rpx;
      color: rgba(169,169,169,.4);
      text-align: center;
      font-size: 28rpx;
      margin: 80rpx 0;
    }
</style>
在main.js里面全局挂载
import WaterMark from '@/components/WaterMark/index.vue';
Vue.component("WaterMark",WaterMark)

在需要的界面直接使用

<WaterMark></WaterMark>