chore(Watermark): rename font-color to text-color (#11743)

This commit is contained in:
neverland 2023-04-08 19:39:10 +08:00 committed by GitHub
parent 0a5e26de15
commit 726a47b414
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 11 additions and 7 deletions

View File

@ -100,7 +100,7 @@ Use the `default` slot to pass HTML directly. Inline styles are supported, and s
| full-page | Whether to display the watermark in full screen | _boolean_ | `true` | | full-page | Whether to display the watermark in full screen | _boolean_ | `true` |
| gapX | Horizontal spacing between watermarks | _number_ | `0` | | gapX | Horizontal spacing between watermarks | _number_ | `0` |
| gapY | Vertical spacing between watermarks | _number_ | `0` | | gapY | Vertical spacing between watermarks | _number_ | `0` |
| font-color | Color of text watermark | _string_ | `#dcdee0` | | text-color | Color of text watermark | _string_ | `#dcdee0` |
| opacity | Opacity of watermark | _number \| string_ | - | | opacity | Opacity of watermark | _number \| string_ | - |
### Slots ### Slots

View File

@ -100,7 +100,7 @@ app.use(Watermark);
| full-page | 水印是否全屏显示 | _boolean_ | `false` | | full-page | 水印是否全屏显示 | _boolean_ | `false` |
| gapX | 水印之间的水平间隔 | _number_ | `0` | | gapX | 水印之间的水平间隔 | _number_ | `0` |
| gapY | 水印之间的垂直间隔 | _number_ | `0` | | gapY | 水印之间的垂直间隔 | _number_ | `0` |
| font-color | 文字水印的颜色 | _string_ | `#dcdee0` | | text-color | 文字水印的颜色 | _string_ | `#dcdee0` |
| opacity | 水印的透明度 | _number \| string_ | - | | opacity | 水印的透明度 | _number \| string_ | - |
### Slots ### Slots

View File

@ -31,7 +31,7 @@ export const watermarkProps = {
content: String, content: String,
opacity: numericProp, opacity: numericProp,
fullPage: truthProp, fullPage: truthProp,
fontColor: makeStringProp('#dcdee0'), textColor: makeStringProp('#dcdee0'),
}; };
export type WatermarkProps = ExtractPropTypes<typeof watermarkProps>; export type WatermarkProps = ExtractPropTypes<typeof watermarkProps>;
@ -76,7 +76,7 @@ export default defineComponent({
{props.content ? ( {props.content ? (
<span <span
style={{ style={{
color: props.fontColor, color: props.textColor,
}} }}
> >
{props.content} {props.content}
@ -140,7 +140,7 @@ export default defineComponent({
() => [ () => [
imageBase64.value, imageBase64.value,
props.content, props.content,
props.fontColor, props.textColor,
props.height, props.height,
props.width, props.width,
props.rotate, props.rotate,
@ -148,7 +148,11 @@ export default defineComponent({
props.gapY, props.gapY,
], ],
() => { () => {
// 路径为 renderWatermark渲染的实际HTML => SVG字符串转换为blob图片 => 放到background-image中。 /**
* The path is the actual HTML rendered by renderWatermark
* => convert the SVG string to a blob image
* => put it in background-image.
*/
nextTick(() => { nextTick(() => {
if (svgElRef.value) { if (svgElRef.value) {
if (watermarkUrl.value) { if (watermarkUrl.value) {

View File

@ -47,7 +47,7 @@ describe('watermark', () => {
const wrapper = mount(Watermark, { const wrapper = mount(Watermark, {
props: { props: {
content: 'Vant', content: 'Vant',
fontColor: 'red', textColor: 'red',
}, },
}); });