index.vue 960 B

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859
  1. <template>
  2. <view class="make">
  3. <view class="list">
  4. <view class="item" v-for="i in 500">
  5. <text>{{ info }}</text>
  6. </view>
  7. </view>
  8. <slot></slot>
  9. </view>
  10. </template>
  11. <script>
  12. export default {
  13. name: "watermark",
  14. props: {
  15. info: {
  16. type: String,
  17. default: "全局水印",
  18. },
  19. },
  20. data() {
  21. return {};
  22. },
  23. };
  24. </script>
  25. <style lang="scss" scoped>
  26. .make {
  27. position: fixed;
  28. width: 100%;
  29. height: 100%;
  30. top: 0;
  31. left: 0;
  32. z-index: 9999;
  33. background: rgba(0, 0, 0, 0);
  34. pointer-events: none;
  35. .list {
  36. width: 500%;
  37. height: 400%;
  38. position: absolute;
  39. top: -50%;
  40. left: -50%;
  41. transform: rotate(-45deg);
  42. display: flex;
  43. flex-wrap: wrap;
  44. justify-content: space-between;
  45. pointer-events: none;
  46. .item {
  47. font-size: 28px;
  48. color: rgba(220, 220, 220, 0.3);
  49. font-weight: bold;
  50. padding: 30rpx;
  51. pointer-events: none;
  52. }
  53. }
  54. }
  55. </style>