fix(watermark): empty watermark when content is empty (#5291)

* fix(watermark): empty watermark when content is empty * docs: update changelog --------- Co-authored-by: 07akioni <07akioni2@gmail.com>
tusen-ai · Nov 11, 2023 · 25254ce · 25254ce
1 parent dcd50bc
commit 25254ce
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 0 deletions.
diff --git a/CHANGELOG.en-US.md b/CHANGELOG.en-US.md
@@ -7,6 +7,7 @@
 - Fix `n-tree` unexposed line color variable `--n-line-color`, closes [#5339](https://github.com/tusen-ai/naive-ui/issues/5339).
 - Fix `n-tree` The style of the selected node is not displayed in the case of 'disabled'.
 - Fix `n-tree` on `virtual-scroll` empty data placeholder lost problem.
+- Fix `n-watermark` won't clear it's content when `content` prop is set to empty.
 
 ### Features
 

diff --git a/CHANGELOG.zh-CN.md b/CHANGELOG.zh-CN.md
@@ -7,6 +7,7 @@
 - 修复 `n-tree` 未暴露连接线颜色变量 `--n-line-color`，关闭[#5339](https://github.com/tusen-ai/naive-ui/issues/5339)
 - 修复 `n-tree` 在 `disabled` 的情况下不显示选中节点的样式
 - 修复 `n-tree` `virtual-scroll` 空数据占位符丢失
+- 修复 `n-watermark` 组件中的 `content` 属性为空时，无法清空水印内容
 
 ### Features
 

diff --git a/src/watermark/src/Watermark.tsx b/src/watermark/src/Watermark.tsx
@@ -203,6 +203,15 @@ export default defineComponent({
             canvasOffsetTop + lineHeight * ratio
           )
           base64UrlRef.value = canvas.toDataURL()
+        } else if (
+          content === '' ||
+          content === undefined ||
+          content === null
+        ) {
+          // For example, you are using the input box to customize the watermark content, but after clearing the input box, the content is empty, and the canvas content is empty
+          // clear canvas when content is empty
+          ctx.clearRect(0, 0, canvas.width, canvas.height)
+          base64UrlRef.value = canvas.toDataURL()
         }
       } else {
         warnOnce('watermark', 'Canvas is not supported in the browser.')