watermark组件props丢失响应性

[my-csl]

nutui-uniapp 版本号

1.3.3

平台

h5

重现链接

nutui-uniapp/packages/nutui/components/watermark /watermark.vue

重现步骤

<script setup lang="ts">
import { computed, defineComponent, reactive, watch } from 'vue'
import { PREFIX } from '../_constants'
import { watermarkEmits, watermarkProps } from './watermark'

const props = defineProps(watermarkProps)
defineEmits(watermarkEmits)

const state = reactive({
  base64Url: '',
})
const {
  zIndex,
  gapX,
  gapY,
  width,
  height,
  rotate,
  image,
  imageWidth,
  imageHeight,
  content,
  fontStyle,
  fontWeight,
  fontColor,
  fontSize,
  fontFamily,
} = props

watch(
  () => [
    zIndex,
    gapX,
    gapY,
    width,
    height,
    rotate,
    image,
    imageWidth,
    imageHeight,
    content,
    fontStyle,
    fontWeight,
    fontColor,
    fontSize,
    fontFamily,
  ],
  () => {
    init()
  },
)
</script>

<template>
  <view
    :class="classes"
    :style="{
      zIndex,
      backgroundSize: `${gapX + width}px`,
      backgroundImage: `url('${state.base64Url}')`,
    }"
  />
</template>

这里的props被解构，但是在wathc中监听了，应该是不会触发watch的，因为被解构了就丢失了响应式了，我看watch直接监听了所有的props属性，应该可以直接监听整个props

watch(props, () => init())

期望的结果是什么？

props更新重新执行init方法

实际的结果是什么？

props更新没有触发init方法

环境信息

No response

其他补充信息

No response