javascript - 前端水印组件设置旋转角度之后部分文字被隐藏了？

Question

<van-watermark
      v-if="waterMessage"
      :full-page="isFull"
      :width="waterMessage.length * 10"
      :rotate="isFull ? 65 : 0"
    >
      <template #content>
        <div :style="{
          width: `${waterMessage.length * 8}px`,
          color: 'rgba(255,255,255, .2)',
          fontSize: '12px'
        }">
          <p>{{ waterMessage }}</p>
        </div>
      </template>
    </van-watermark>

isFull 变为 true 旋转角度为65%，文字部分被隐藏了？

Answer 1

感觉是旋转之后被上面的遮挡了
可以试下复制一个直接展示旋转后的角度 看会不会
如果不会的话 估计就是生成的时候位置已经固定了
然后你就复制两份 用你那个变量控制展示哪个

Answer 2

文字的宽高弄大点，应该是用canvas画旋转文字的时候超出画布区域了