ソースを参照

fix: waterMark taro版本修改 (#1982)

lkjh3214 3 年 前
コミット
89a709d28c

+ 10 - 10
src/packages/__VUE/backtop/doc.en-US.md

@@ -206,13 +206,13 @@ app.use(Backtop);
 
 | Attribute            | Description                 | Type    | Default  |
 |-----------------|------------------------------------------|---------|---------|
-| el-id           | Get the parent element of the listening element         | String | -       |
-| bottom         | Distance from bottom of page    | Number  | `20`       |
-| right        | Distance from the right side of the page      | Number |  `10`  |
-| distance     | How high to scroll the page vertically   | Number  | `200`      |
-| z-index         | Set the component z-index   | Number  | `10`       |  
-| is-animation         | Whether there is animation, mutually exclusive with the duration parameter   | Boolean  | `true`       |  
-| duration         | Set animation duration   | Number  | `1000`       |                                          
+| el-id           | Get the parent element of the listening element         | string | -       |
+| bottom         | Distance from bottom of page    | number  | `20`       |
+| right        | Distance from the right side of the page      | number |  `10`  |
+| distance     | How high to scroll the page vertically   | number  | `200`      |
+| z-index         | Set the component z-index   | number  | `10`       |  
+| is-animation         | Whether there is animation, mutually exclusive with the duration parameter   | boolean  | `true`       |  
+| duration         | Set animation duration   | number  | `1000`       |                                          
 
 ### Events
 | Event  | Description     | Arguments    |
@@ -230,6 +230,6 @@ app.use(Backtop);
 ### CSS Variables
 
 The component provides the following CSS variables, which can be used to customize styles. Please refer to [ConfigProvider component](#/en-US/config-provider).
-| Name | Default Value | Description |
-| --------------------------------------- | -------------------------- | ---- |
-| --nut-backtop-border-color       | _#e0e0e0_        | -    |
+| Name | Default Value | 
+| --------------------------------------- | -------------------------- | 
+| --nut-backtop-border-color       | _#e0e0e0_        | 

+ 10 - 10
src/packages/__VUE/backtop/doc.md

@@ -210,13 +210,13 @@ app.use(Backtop);
 
 | 字段            | 说明                 | 类型    | 默认值  |
 |-----------------|------------------------------------------|---------|---------|
-| el-id           | 获取监听元素的父级元素         | String | -       |
-| bottom         | 距离页面底部距离    | Number  | `20`       |
-| right        | 距离页面右侧距离      | Number |  `10`  |
-| distance     | 页面垂直滚动多高后出现   | Number  | `200`      |
-| z-index         | 设置组件页面层级   | Number  | `10`       |  
-| is-animation         | 是否有动画,和duration参数互斥   | Boolean  | `true`       |  
-| duration         | 设置动画持续时间   | Number  | `1000`       |                                          
+| el-id           | 获取监听元素的父级元素         | string | -       |
+| bottom         | 距离页面底部距离    | number  | `20`       |
+| right        | 距离页面右侧距离      | number |  `10`  |
+| distance     | 页面垂直滚动多高后出现   | number  | `200`      |
+| z-index         | 设置组件页面层级   | number  | `10`       |  
+| is-animation         | 是否有动画,和duration参数互斥   | boolean  | `true`       |  
+| duration         | 设置动画持续时间   | number  | `1000`       |                                          
 
 ### Events
 | 名称  | 说明     | 回调参数    |
@@ -235,6 +235,6 @@ app.use(Backtop);
 
 组件提供了下列 CSS 变量,可用于自定义样式,使用方法请参考 [ConfigProvider 组件](#/zh-CN/config-provider)。
 
-| 名称                                    | 默认值                     | 描述 |
-| --------------------------------------- | -------------------------- | ---- |
-| --nut-backtop-border-color       | _#e0e0e0_        | -    |
+| 名称                                    | 默认值                     | 
+| --------------------------------------- | -------------------------- | 
+| --nut-backtop-border-color       | _#e0e0e0_        | 

+ 8 - 8
src/packages/__VUE/backtop/doc.taro.md

@@ -200,11 +200,11 @@ export default {
 
 | 字段            | 说明                 | 类型    | 默认值  |
 |-----------------|------------------------------------------|---------|---------|
-| height           | 滚动区域的高度         | String | `100vh`       |
-| bottom         | 距离页面底部距离    | Number  | `20`       |
-| right        | 距离页面右侧距离      | Number |  `10`  |
-| distance     | 页面垂直滚动多高后出现   | Number  | `200`      |
-| z-index         | 设置组件页面层级   | Number  | `10`       |                                          
+| height           | 滚动区域的高度         | string | `100vh`       |
+| bottom         | 距离页面底部距离    | number  | `20`       |
+| right        | 距离页面右侧距离      | number |  `10`  |
+| distance     | 页面垂直滚动多高后出现   | number  | `200`      |
+| z-index         | 设置组件页面层级   | number  | `10`       |                                          
 
 ### Events
 | 名称  | 说明     | 回调参数    |
@@ -224,6 +224,6 @@ export default {
 
 组件提供了下列 CSS 变量,可用于自定义样式,使用方法请参考 [ConfigProvider 组件](#/zh-CN/config-provider)。
 
-| 名称                                    | 默认值                     | 描述 |
-| --------------------------------------- | -------------------------- | ---- |
-| --nut-backtop-border-color       | _#e0e0e0_        | -    |
+| 名称                                    | 默认值                     | 
+| --------------------------------------- | -------------------------- | 
+| --nut-backtop-border-color       | _#e0e0e0_        |

+ 51 - 51
src/packages/__VUE/button/doc.en-US.md

@@ -194,14 +194,14 @@ The color of the button can be customized through the color property.
 
 | Attribute     | Description                                                         | Type    | Default    |
 | -------- | ------------------------------------------------------------ | ------- | --------- |
-| type     | Can be set to  `primary` `info` `warning` `danger` `success` | String  | `default` |
-| size     | 	Can be set to `large` `small` `mini`                        | String  | `normal`  |
-| shape    | Can be set to `square`                                      | String  | `round`   |
-| color    | Button color, support incoming linear-gradient gradient color                    | String  | -         |
-| plain    | Whether to be plain button     | Boolean | `false`   |
-| disabled | Whether to disable button         | Boolean | `false`   |
-| block    | Whether to set display block      | Boolean | `false`   |
-| loading  | Whether to show loading status     | Boolean | `false`   |
+| type     | Can be set to  `primary` `info` `warning` `danger` `success` | string  | `default` |
+| size     | 	Can be set to `large` `small` `mini`                        | string  | `normal`  |
+| shape    | Can be set to `square`                                      | string  | `round`   |
+| color    | Button color, support incoming linear-gradient gradient color                    | string  | -         |
+| plain    | Whether to be plain button     | boolean | `false`   |
+| disabled | Whether to disable button         | boolean | `false`   |
+| block    | Whether to set display block      | boolean | `false`   |
+| loading  | Whether to show loading status     | boolean | `false`   |
 
 ### Events
 
@@ -215,46 +215,46 @@ The color of the button can be customized through the color property.
 
 The component provides the following CSS variables, which can be used to customize styles. Please refer to [ConfigProvider component](#/en-US/config-provider).
 
-| Name | Default Value | Description |
-| --------------------------------------- | -------------------------- | ---- |
-| --nut-button-border-radius| _25px_  | - |
-| --nut-button-border-width| _1px_  | - |
-| --nut-button-icon-width| _16px_  | - |
-| --nut-button-default-bg-color| _var(--nut-white)_  | - |
-| --nut-button-default-border-color| _rgba(204, 204, 204, 1)_  | - |
-| --nut-button-default-color| _rgba(102, 102, 102, 1)_  | - |
-| --nut-button-default-padding| _0 18px_  | - |
-| --nut-button-mini-padding| _0 12px_  | - |
-| --nut-button-small-padding| _0 12px_  | - |
-| --nut-button-small-height| _28px_  | - |
-| --nut-button-mini-height| _24px_  | - |
-| --nut-button-default-height| _38px_  | - |
-| --nut-button-large-height| _48px_  | - |
-| --nut-button-large-line-height| _46px_  | - |
-| --nut-button-small-line-height| _26px_  | - |
-| --nut-button-block-height| _48px_  | - |
-| --nut-button-default-line-height| _36px_  | - |
-| --nut-button-block-line-height| _46px_  | - |
-| --nut-button-default-font-size| _var(--nut-font-size-2)_  | - |
-| --nut-button-large-font-size| _var(--nut-button-default-font-size)_  | - |
-| --nut-button-small-font-size| _var(--nut-font-size-1)_  | - |
-| --nut-button-mini-font-size| _var(--nut-font-size-1)_  | - |
-| --nut-button-mini-line-height| _1.2_  | - |
-| --nut-button-disabled-opacity| _0.68_  | - |
-| --nut-button-primary-color| _var(--nut-white)_  | - |
-| --nut-button-primary-border-color| _var(--nut-primary-color)_  | - |
-| --nut-button-primary-background-color| _linear-gradient(135deg,var(--nut-primary-color) 0%,var(--nut-primary-color-end) 100%)_  | - |
-| --nut-button-info-color| _var(--nut-white)_  | - |
-| --nut-button-info-border-color| _rgba(73, 106, 242, 1)_  | - |
-| --nut-button-info-background-color| _linear-gradient(315deg, rgba(73, 143, 242, 1) 0%, rgba(73, 101, 242, 1) 100%)_  | - |
-| --nut-button-success-color| _var(--nut-white)_  | - |
-| --nut-button-success-border-color| _rgba(38, 191, 38, 1)_  | - |
-| --nut-button-success-background-color| _linear-gradient(135deg,rgba(38, 191, 38, 1) 0%,rgba(39, 197, 48, 1) 45%,rgba(40, 207, 63, 1) 83%,rgba(41, 212, 70, 1) 100%)_  | - |
-| --nut-button-danger-color| _var(--nut-white)_  | - |
-| --nut-button-danger-border-color| _rgba(250, 44, 25, 1)_  | - |
-| --nut-button-danger-background-color| _rgba(250, 44, 25, 1)_  | - |
-| --nut-button-warning-color| _var(--nut-white)_  | - |
-| --nut-button-warning-border-color| _rgba(255, 158, 13, 1)_  | - |
-| --nut-button-warning-background-color| _linear-gradient(135deg,rgba(255, 158, 13, 1) 0%,rgba(255, 167, 13, 1) 45%,rgba(255, 182, 13, 1) 83%,rgba(255, 190, 13, 1) 100%)_  | - |
-| --nut-button-plain-background-color| _var(--nut-white)_  | - |
-| --nut-button-small-round-border-radius| _var(--nut-button-border-radius)_  | - |
+| Name | Default Value | 
+| --------------------------------------- | -------------------------- |
+| --nut-button-border-radius| _25px_  |
+| --nut-button-border-width| _1px_  |
+| --nut-button-icon-width| _16px_  |
+| --nut-button-default-bg-color| _var(--nut-white)_  |
+| --nut-button-default-border-color| _rgba(204, 204, 204, 1)_  |
+| --nut-button-default-color| _rgba(102, 102, 102, 1)_  |
+| --nut-button-default-padding| _0 18px_  |
+| --nut-button-mini-padding| _0 12px_  |
+| --nut-button-small-padding| _0 12px_  |
+| --nut-button-small-height| _28px_  |
+| --nut-button-mini-height| _24px_  |
+| --nut-button-default-height| _38px_  |
+| --nut-button-large-height| _48px_  |
+| --nut-button-large-line-height| _46px_  |
+| --nut-button-small-line-height| _26px_  |
+| --nut-button-block-height| _48px_  |
+| --nut-button-default-line-height| _36px_  |
+| --nut-button-block-line-height| _46px_  |
+| --nut-button-default-font-size| _var(--nut-font-size-2)_  |
+| --nut-button-large-font-size| _var(--nut-button-default-font-size)_  |
+| --nut-button-small-font-size| _var(--nut-font-size-1)_  |
+| --nut-button-mini-font-size| _var(--nut-font-size-1)_  |
+| --nut-button-mini-line-height| _1.2_  |
+| --nut-button-disabled-opacity| _0.68_  |
+| --nut-button-primary-color| _var(--nut-white)_  |
+| --nut-button-primary-border-color| _var(--nut-primary-color)_  |
+| --nut-button-primary-background-color| _linear-gradient(135deg,var(--nut-primary-color) 0%,var(--nut-primary-color-end) 100%)_  |
+| --nut-button-info-color| _var(--nut-white)_  |
+| --nut-button-info-border-color| _rgba(73, 106, 242, 1)_  |
+| --nut-button-info-background-color| _linear-gradient(315deg, rgba(73, 143, 242, 1) 0%, rgba(73, 101, 242, 1) 100%)_  |
+| --nut-button-success-color| _var(--nut-white)_  |
+| --nut-button-success-border-color| _rgba(38, 191, 38, 1)_  |
+| --nut-button-success-background-color| _linear-gradient(135deg,rgba(38, 191, 38, 1) 0%,rgba(39, 197, 48, 1) 45%,rgba(40, 207, 63, 1) 83%,rgba(41, 212, 70, 1) 100%)_  |
+| --nut-button-danger-color| _var(--nut-white)_  |
+| --nut-button-danger-border-color| _rgba(250, 44, 25, 1)_  |
+| --nut-button-danger-background-color| _rgba(250, 44, 25, 1)_  |
+| --nut-button-warning-color| _var(--nut-white)_  |
+| --nut-button-warning-border-color| _rgba(255, 158, 13, 1)_  |
+| --nut-button-warning-background-color| _linear-gradient(135deg,rgba(255, 158, 13, 1) 0%,rgba(255, 167, 13, 1) 45%,rgba(255, 182, 13, 1) 83%,rgba(255, 190, 13, 1) 100%)_  |
+| --nut-button-plain-background-color| _var(--nut-white)_  |
+| --nut-button-small-round-border-radius| _var(--nut-button-border-radius)_  |

+ 51 - 51
src/packages/__VUE/button/doc.md

@@ -193,14 +193,14 @@ app.use(Button);
 
 | 参数     | 说明                                                         | 类型    | 默认值    |
 | -------- | ------------------------------------------------------------ | ------- | --------- |
-| type     | 类型,可选值为 `primary` `info` `warning` `danger` `success` | String  | `default` |
-| size     | 尺寸,可选值为 `large` `small` `mini`                        | String  | `normal`  |
-| shape    | 形状,可选值为 `square`                                      | String  | `round`   |
-| color    | 按钮颜色,支持传入 linear-gradient 渐变色                    | String  | -         |
-| plain    | 是否为朴素按钮                                               | Boolean | `false`   |
-| disabled | 是否禁用按钮                                                 | Boolean | `false`   |
-| block    | 是否为块级元素                                               | Boolean | `false`   |
-| loading  | 按钮 loading 状态                                            | Boolean | `false`   |
+| type     | 类型,可选值为 `primary` `info` `warning` `danger` `success` | string  | `default` |
+| size     | 尺寸,可选值为 `large` `small` `mini`                        | string  | `normal`  |
+| shape    | 形状,可选值为 `square`                                      | string  | `round`   |
+| color    | 按钮颜色,支持传入 linear-gradient 渐变色                    | string  | -         |
+| plain    | 是否为朴素按钮                                               | boolean | `false`   |
+| disabled | 是否禁用按钮                                                 | boolean | `false`   |
+| block    | 是否为块级元素                                               | boolean | `false`   |
+| loading  | 按钮 loading 状态                                            | boolean | `false`   |
 
 ### Slots
 
@@ -223,46 +223,46 @@ app.use(Button);
 
 组件提供了下列 CSS 变量,可用于自定义样式,使用方法请参考 [ConfigProvider 组件](#/zh-CN/config-provider)。
 
-| 名称                                    | 默认值                     | 描述 |
-| --------------------------------------- | -------------------------- | ---- |
-| --nut-button-border-radius| _25px_  | - |
-| --nut-button-border-width| _1px_  | - |
-| --nut-button-icon-width| _16px_  | - |
-| --nut-button-default-bg-color| _var(--nut-white)_  | - |
-| --nut-button-default-border-color| _rgba(204, 204, 204, 1)_  | - |
-| --nut-button-default-color| _rgba(102, 102, 102, 1)_  | - |
-| --nut-button-default-padding| _0 18px_  | - |
-| --nut-button-mini-padding| _0 12px_  | - |
-| --nut-button-small-padding| _0 12px_  | - |
-| --nut-button-small-height| _28px_  | - |
-| --nut-button-mini-height| _24px_  | - |
-| --nut-button-default-height| _38px_  | - |
-| --nut-button-large-height| _48px_  | - |
-| --nut-button-large-line-height| _46px_  | - |
-| --nut-button-small-line-height| _26px_  | - |
-| --nut-button-block-height| _48px_  | - |
-| --nut-button-default-line-height| _36px_  | - |
-| --nut-button-block-line-height| _46px_  | - |
-| --nut-button-default-font-size| _var(--nut-font-size-2)_  | - |
-| --nut-button-large-font-size| _var(--nut-button-default-font-size)_  | - |
-| --nut-button-small-font-size| _var(--nut-font-size-1)_  | - |
-| --nut-button-mini-font-size| _var(--nut-font-size-1)_  | - |
-| --nut-button-mini-line-height| _1.2_  | - |
-| --nut-button-disabled-opacity| _0.68_  | - |
-| --nut-button-primary-color| _var(--nut-white)_  | - |
-| --nut-button-primary-border-color| _var(--nut-primary-color)_  | - |
-| --nut-button-primary-background-color| _linear-gradient(135deg,var(--nut-primary-color) 0%,var(--nut-primary-color-end) 100%)_  | - |
-| --nut-button-info-color| _var(--nut-white)_  | - |
-| --nut-button-info-border-color| _rgba(73, 106, 242, 1)_  | - |
-| --nut-button-info-background-color| _linear-gradient(315deg, rgba(73, 143, 242, 1) 0%, rgba(73, 101, 242, 1) 100%)_  | - |
-| --nut-button-success-color| _var(--nut-white)_  | - |
-| --nut-button-success-border-color| _rgba(38, 191, 38, 1)_  | - |
-| --nut-button-success-background-color| _linear-gradient(135deg,rgba(38, 191, 38, 1) 0%,rgba(39, 197, 48, 1) 45%,rgba(40, 207, 63, 1) 83%,rgba(41, 212, 70, 1) 100%)_  | - |
-| --nut-button-danger-color| _var(--nut-white)_  | - |
-| --nut-button-danger-border-color| _rgba(250, 44, 25, 1)_  | - |
-| --nut-button-danger-background-color| _rgba(250, 44, 25, 1)_  | - |
-| --nut-button-warning-color| _var(--nut-white)_  | - |
-| --nut-button-warning-border-color| _rgba(255, 158, 13, 1)_  | - |
-| --nut-button-warning-background-color| _linear-gradient(135deg,rgba(255, 158, 13, 1) 0%,rgba(255, 167, 13, 1) 45%,rgba(255, 182, 13, 1) 83%,rgba(255, 190, 13, 1) 100%)_  | - |
-| --nut-button-plain-background-color| _var(--nut-white)_  | - |
-| --nut-button-small-round-border-radius| _var(--nut-button-border-radius)_  | - |
+| 名称                                    | 默认值                     | 
+| --------------------------------------- | -------------------------- | 
+| --nut-button-border-radius| _25px_  |
+| --nut-button-border-width| _1px_  |
+| --nut-button-icon-width| _16px_  |
+| --nut-button-default-bg-color| _var(--nut-white)_  |
+| --nut-button-default-border-color| _rgba(204, 204, 204, 1)_  |
+| --nut-button-default-color| _rgba(102, 102, 102, 1)_  |
+| --nut-button-default-padding| _0 18px_  |
+| --nut-button-mini-padding| _0 12px_  |
+| --nut-button-small-padding| _0 12px_  |
+| --nut-button-small-height| _28px_  |
+| --nut-button-mini-height| _24px_  |
+| --nut-button-default-height| _38px_  |
+| --nut-button-large-height| _48px_  |
+| --nut-button-large-line-height| _46px_  |
+| --nut-button-small-line-height| _26px_  |
+| --nut-button-block-height| _48px_  |
+| --nut-button-default-line-height| _36px_  |
+| --nut-button-block-line-height| _46px_  |
+| --nut-button-default-font-size| _var(--nut-font-size-2)_  |
+| --nut-button-large-font-size| _var(--nut-button-default-font-size)_  |
+| --nut-button-small-font-size| _var(--nut-font-size-1)_  |
+| --nut-button-mini-font-size| _var(--nut-font-size-1)_  |
+| --nut-button-mini-line-height| _1.2_  |
+| --nut-button-disabled-opacity| _0.68_  |
+| --nut-button-primary-color| _var(--nut-white)_  |
+| --nut-button-primary-border-color| _var(--nut-primary-color)_  |
+| --nut-button-primary-background-color| _linear-gradient(135deg,var(--nut-primary-color) 0%,var(--nut-primary-color-end) 100%)_  |
+| --nut-button-info-color| _var(--nut-white)_  |
+| --nut-button-info-border-color| _rgba(73, 106, 242, 1)_  |
+| --nut-button-info-background-color| _linear-gradient(315deg, rgba(73, 143, 242, 1) 0%, rgba(73, 101, 242, 1) 100%)_  |
+| --nut-button-success-color| _var(--nut-white)_  |
+| --nut-button-success-border-color| _rgba(38, 191, 38, 1)_  |
+| --nut-button-success-background-color| _linear-gradient(135deg,rgba(38, 191, 38, 1) 0%,rgba(39, 197, 48, 1) 45%,rgba(40, 207, 63, 1) 83%,rgba(41, 212, 70, 1) 100%)_  |
+| --nut-button-danger-color| _var(--nut-white)_  |
+| --nut-button-danger-border-color| _rgba(250, 44, 25, 1)_  |
+| --nut-button-danger-background-color| _rgba(250, 44, 25, 1)_  |
+| --nut-button-warning-color| _var(--nut-white)_  |
+| --nut-button-warning-border-color| _rgba(255, 158, 13, 1)_  |
+| --nut-button-warning-background-color| _linear-gradient(135deg,rgba(255, 158, 13, 1) 0%,rgba(255, 167, 13, 1) 45%,rgba(255, 182, 13, 1) 83%,rgba(255, 190, 13, 1) 100%)_  |
+| --nut-button-plain-background-color| _var(--nut-white)_  |
+| --nut-button-small-round-border-radius| _var(--nut-button-border-radius)_  |

+ 52 - 54
src/packages/__VUE/button/doc.taro.md

@@ -191,17 +191,15 @@ app.use(Button);
 
 | 参数     | 说明                                                         | 类型    | 默认值    |
 | -------- | ------------------------------------------------------------ | ------- | --------- |
-| type     | 类型,可选值为 `primary` `info` `warning` `danger` `success` | String  | `default` |
-| size     | 尺寸,可选值为 `large` `small` `mini`                        | String  | `normal`  |
-| shape    | 形状,可选值为 `square`                                      | String  | `round`   |
-| color    | 按钮颜色,支持传入 linear-gradient 渐变色                    | String  | -         |
-| plain    | 是否为朴素按钮                                               | Boolean | `false`   |
-| disabled | 是否禁用按钮                                                 | Boolean | `false`   |
-| block    | 是否为块级元素                                               | Boolean | `false`   |
-| icon     | 按钮图标,同 Icon 组件 name 属性                             | String  | -         |
-| icon-font-class-name | 自定义 icon 字体基础类名                         | String | `nutui-iconfont` |
-| icon-class-prefix   | 自定义 icon 类名前缀,用于使用自定义图标           | String | `nut-icon`       |
-| loading  | 按钮 loading 状态                                            | Boolean | `false`   |
+| type     | 类型,可选值为 `primary` `info` `warning` `danger` `success` | string  | `default` |
+| size     | 尺寸,可选值为 `large` `small` `mini`                        | string  | `normal`  |
+| shape    | 形状,可选值为 `square`                                      | string  | `round`   |
+| color    | 按钮颜色,支持传入 linear-gradient 渐变色                    | string  | -         |
+| plain    | 是否为朴素按钮                                               | boolean | `false`   |
+| disabled | 是否禁用按钮                                                 | boolean | `false`   |
+| block    | 是否为块级元素                                               | boolean | `false`   |
+| icon     | 按钮图标,同 Icon 组件 name 属性                             | string  | -         |
+| loading  | 按钮 loading 状态                                            | boolean | `false`   |
 
 ### Events
 
@@ -215,46 +213,46 @@ app.use(Button);
 
 组件提供了下列 CSS 变量,可用于自定义样式,使用方法请参考 [ConfigProvider 组件](#/zh-CN/config-provider)。
 
-| 名称                                    | 默认值                     | 描述 |
-| --------------------------------------- | -------------------------- | ---- |
-| --nut-button-border-radius| _25px_  | - |
-| --nut-button-border-width| _1px_  | - |
-| --nut-button-icon-width| _16px_  | - |
-| --nut-button-default-bg-color| _var(--nut-white)_  | - |
-| --nut-button-default-border-color| _rgba(204, 204, 204, 1)_  | - |
-| --nut-button-default-color| _rgba(102, 102, 102, 1)_  | - |
-| --nut-button-default-padding| _0 18px_  | - |
-| --nut-button-mini-padding| _0 12px_  | - |
-| --nut-button-small-padding| _0 12px_  | - |
-| --nut-button-small-height| _28px_  | - |
-| --nut-button-mini-height| _24px_  | - |
-| --nut-button-default-height| _38px_  | - |
-| --nut-button-large-height| _48px_  | - |
-| --nut-button-large-line-height| _46px_  | - |
-| --nut-button-small-line-height| _26px_  | - |
-| --nut-button-block-height| _48px_  | - |
-| --nut-button-default-line-height| _36px_  | - |
-| --nut-button-block-line-height| _46px_  | - |
-| --nut-button-default-font-size| _var(--nut-font-size-2)_  | - |
-| --nut-button-large-font-size| _var(--nut-button-default-font-size)_  | - |
-| --nut-button-small-font-size| _var(--nut-font-size-1)_  | - |
-| --nut-button-mini-font-size| _var(--nut-font-size-1)_  | - |
-| --nut-button-mini-line-height| _1.2_  | - |
-| --nut-button-disabled-opacity| _0.68_  | - |
-| --nut-button-primary-color| _var(--nut-white)_  | - |
-| --nut-button-primary-border-color| _var(--nut-primary-color)_  | - |
-| --nut-button-primary-background-color| _linear-gradient(135deg,var(--nut-primary-color) 0%,var(--nut-primary-color-end) 100%)_  | - |
-| --nut-button-info-color| _var(--nut-white)_  | - |
-| --nut-button-info-border-color| _rgba(73, 106, 242, 1)_  | - |
-| --nut-button-info-background-color| _linear-gradient(315deg, rgba(73, 143, 242, 1) 0%, rgba(73, 101, 242, 1) 100%)_  | - |
-| --nut-button-success-color| _var(--nut-white)_  | - |
-| --nut-button-success-border-color| _rgba(38, 191, 38, 1)_  | - |
-| --nut-button-success-background-color| _linear-gradient(135deg,rgba(38, 191, 38, 1) 0%,rgba(39, 197, 48, 1) 45%,rgba(40, 207, 63, 1) 83%,rgba(41, 212, 70, 1) 100%)_  | - |
-| --nut-button-danger-color| _var(--nut-white)_  | - |
-| --nut-button-danger-border-color| _rgba(250, 44, 25, 1)_  | - |
-| --nut-button-danger-background-color| _rgba(250, 44, 25, 1)_  | - |
-| --nut-button-warning-color| _var(--nut-white)_  | - |
-| --nut-button-warning-border-color| _rgba(255, 158, 13, 1)_  | - |
-| --nut-button-warning-background-color| _linear-gradient(135deg,rgba(255, 158, 13, 1) 0%,rgba(255, 167, 13, 1) 45%,rgba(255, 182, 13, 1) 83%,rgba(255, 190, 13, 1) 100%)_  | - |
-| --nut-button-plain-background-color| _var(--nut-white)_  | - |
-| --nut-button-small-round-border-radius| _var(--nut-button-border-radius)_  | - |
+| 名称                                    | 默认值                     | 
+| --------------------------------------- | -------------------------- | 
+| --nut-button-border-radius| _25px_  |
+| --nut-button-border-width| _1px_  |
+| --nut-button-icon-width| _16px_  |
+| --nut-button-default-bg-color| _var(--nut-white)_  |
+| --nut-button-default-border-color| _rgba(204, 204, 204, 1)_  |
+| --nut-button-default-color| _rgba(102, 102, 102, 1)_  |
+| --nut-button-default-padding| _0 18px_  |
+| --nut-button-mini-padding| _0 12px_  |
+| --nut-button-small-padding| _0 12px_  |
+| --nut-button-small-height| _28px_  |
+| --nut-button-mini-height| _24px_  |
+| --nut-button-default-height| _38px_  |
+| --nut-button-large-height| _48px_  |
+| --nut-button-large-line-height| _46px_  |
+| --nut-button-small-line-height| _26px_  |
+| --nut-button-block-height| _48px_  |
+| --nut-button-default-line-height| _36px_  |
+| --nut-button-block-line-height| _46px_  |
+| --nut-button-default-font-size| _var(--nut-font-size-2)_  |
+| --nut-button-large-font-size| _var(--nut-button-default-font-size)_  |
+| --nut-button-small-font-size| _var(--nut-font-size-1)_  |
+| --nut-button-mini-font-size| _var(--nut-font-size-1)_  |
+| --nut-button-mini-line-height| _1.2_  |
+| --nut-button-disabled-opacity| _0.68_  |
+| --nut-button-primary-color| _var(--nut-white)_  |
+| --nut-button-primary-border-color| _var(--nut-primary-color)_  |
+| --nut-button-primary-background-color| _linear-gradient(135deg,var(--nut-primary-color) 0%,var(--nut-primary-color-end) 100%)_  |
+| --nut-button-info-color| _var(--nut-white)_  |
+| --nut-button-info-border-color| _rgba(73, 106, 242, 1)_  |
+| --nut-button-info-background-color| _linear-gradient(315deg, rgba(73, 143, 242, 1) 0%, rgba(73, 101, 242, 1) 100%)_  |
+| --nut-button-success-color| _var(--nut-white)_  |
+| --nut-button-success-border-color| _rgba(38, 191, 38, 1)_  |
+| --nut-button-success-background-color| _linear-gradient(135deg,rgba(38, 191, 38, 1) 0%,rgba(39, 197, 48, 1) 45%,rgba(40, 207, 63, 1) 83%,rgba(41, 212, 70, 1) 100%)_  |
+| --nut-button-danger-color| _var(--nut-white)_  |
+| --nut-button-danger-border-color| _rgba(250, 44, 25, 1)_  |
+| --nut-button-danger-background-color| _rgba(250, 44, 25, 1)_  |
+| --nut-button-warning-color| _var(--nut-white)_  |
+| --nut-button-warning-border-color| _rgba(255, 158, 13, 1)_  |
+| --nut-button-warning-background-color| _linear-gradient(135deg,rgba(255, 158, 13, 1) 0%,rgba(255, 167, 13, 1) 45%,rgba(255, 182, 13, 1) 83%,rgba(255, 190, 13, 1) 100%)_  |
+| --nut-button-plain-background-color| _var(--nut-white)_  |
+| --nut-button-small-round-border-radius| _var(--nut-button-border-radius)_  |

+ 35 - 35
src/packages/__VUE/calendar/doc.en-US.md

@@ -595,22 +595,22 @@ export default {
 
 | Attribute              | Description                                  | Type            | Default  |
 |-------------------|---------------------------------------------------|-----------------|-----------------|
-| v-model:visible   | whether to show                  | Boolean         | false           |
-| type              | Calendar type :'one' 'range' 'multiple'    | String          | 'one'           |
-| poppable          | Whether to display the pop-up window                                  | Boolean         | true            |
-| is-auto-back-fill | Automatic backfill                                          | Boolean         | false           |
-| title             | whether to show title                                          | String          | ‘Calendar’      |
-| default-value     | Default value, select single date : `String`,other: `Array` | String 、 Array | null            |
-| start-date        | The start date            | String          | Today            |
-| end-date          | The end date            | String          | 365 days from today |
-| show-today          | Whether to show today's mark               | Boolean          | true |
-| start-text         | Range selection, start part of the text              | String          | Start |
-| end-text         | Range selection, end part of the text            | String          | End |
-| confirm-text          | Bottom confirm button text               | String          | ’Confirm‘ |
-| show-title          | Whether to show the calendar title               | Boolean          | true |
-| show-sub-title          | Whether to display the date title              | Boolean          | true |
-| to-date-animation          | Whether to use scroll animation              | Boolean          | true |
-| first-day-of-week          | Set the start day of week              | 0-6          | 0 |
+| v-model:visible   | whether to show                  | boolean         | `false`           |
+| type              | Calendar type :'one' 'range' 'multiple'    | string          | `one`           |
+| poppable          | Whether to display the pop-up window                                  | boolean         | `true`            |
+| is-auto-back-fill | Automatic backfill                                          | boolean         | `false`           |
+| title             | whether to show title                                          | string          | `Calendar`      |
+| default-value     | Default value, select single date : `string`,other: `array` | string 、 array | `null`            |
+| start-date        | The start date            | string          | `Today`            |
+| end-date          | The end date            | string          | `365 days from today` |
+| show-today          | Whether to show today's mark               | boolean          | `true` |
+| start-text         | Range selection, start part of the text              | string          | `Start` |
+| end-text         | Range selection, end part of the text            | string          | `End` |
+| confirm-text          | Bottom confirm button text               | string          | `Confirm` |
+| show-title          | Whether to show the calendar title               | boolean          | `true` |
+| show-sub-title          | Whether to display the date title              | boolean          | `true` |
+| to-date-animation          | Whether to use scroll animation              | boolean          | `true` |
+| first-day-of-week          | Set the start day of week              | 0-6          | `0` |
 
 ### Events
 
@@ -646,23 +646,23 @@ Through [ref](https://vuejs.org/guide/essentials/template-refs.html), you can ge
 
 The component provides the following CSS variables, which can be used to customize styles. Please refer to [ConfigProvider component](#/en-US/config-provider).
 
-| Name | Default Value | Description |
-| --------------------------------------- | -------------------------- | ---- |
-| --nut-calendar-primary-color| _var(--nut-primary-color)_   | - |
-| --nut-calendar-choose-color| _var(--nut-active-color)_   | - |
-| --nut-calendar-choose-font-color| _var(--nut-primary-color)_   | - |
-| --nut-calendar-base-color| _#333333_   | - |
-| --nut-calendar-disable-color| _#d1d0d0_   | - |
-| --nut-calendar-base-font| _var(--nut-font-size-3)_   | - |
-| --nut-calendar-title-font| _var(--nut-font-size-4)_   | - |
-| --nut-calendar-title-font-weight| _500_   | - |
-| --nut-calendar-sub-title-font| _var(--nut-font-size-2)_   | - |
-| --nut-calendar-text-font| _var(--nut-font-size-1)_   | - |
-| --nut-calendar-day-font| _16px_   | - |
-| --nut-calendar-day-active-border-radius| _0px_   | - |
-| --nut-calendar-day-width| _14.28%_   | - |
-| --nut-calendar-day-height| _64px_   | - |
-| --nut-calendar-day-font-weight| _500_   | - |
-| --nut-calendar-day67-font-color| _var(--nut-primary-color)_   | - |
-| --nut-calendar-month-title-font-size| _inherit_   | - |
+| Name | Default Value | 
+| --------------------------------------- | -------------------------- | 
+| --nut-calendar-primary-color| _var(--nut-primary-color)_   |
+| --nut-calendar-choose-color| _var(--nut-active-color)_   |
+| --nut-calendar-choose-font-color| _var(--nut-primary-color)_   |
+| --nut-calendar-base-color| _#333333_   |
+| --nut-calendar-disable-color| _#d1d0d0_   |
+| --nut-calendar-base-font| _var(--nut-font-size-3)_   |
+| --nut-calendar-title-font| _var(--nut-font-size-4)_   |
+| --nut-calendar-title-font-weight| _500_   |
+| --nut-calendar-sub-title-font| _var(--nut-font-size-2)_   |
+| --nut-calendar-text-font| _var(--nut-font-size-1)_   |
+| --nut-calendar-day-font| _16px_   |
+| --nut-calendar-day-active-border-radius| _0px_   |
+| --nut-calendar-day-width| _14.28%_   |
+| --nut-calendar-day-height| _64px_   |
+| --nut-calendar-day-font-weight| _500_   |
+| --nut-calendar-day67-font-color| _var(--nut-primary-color)_   |
+| --nut-calendar-month-title-font-size| _inherit_   |
 

+ 35 - 35
src/packages/__VUE/calendar/doc.md

@@ -588,22 +588,22 @@ export default {
 
 | 字段              | 说明                                              | 类型            | 默认值          |
 |-------------------|---------------------------------------------------|-----------------|-----------------|
-| v-model:visible   | 是否可见                                          | Boolean         | false           |
-| type              | 类型,日期单择'one',区间选择'range',日期多选'multiple'    | String          | 'one'           |
-| poppable          | 是否弹窗状态展示                                  | Boolean         | true            |
-| is-auto-back-fill | 自动回填                                          | Boolean         | false           |
-| title             | 显示标题                                          | String          | ‘日期选择’      |
-| default-value     | 默认值,单个日期选择 String,其他为 Array  | String 、 Array | null            |
-| start-date        | 开始日期         | String          | 今天            |
-| end-date          | 结束日期              | String          | 距离今天 365 天 |
-| show-today          | 是否展示今天标记               | Boolean          | true |
-| start-text         | 范围选择,开始信息文案               | String          | ’开始‘ |
-| end-text         | 范围选择,结束信息文案               | String          | ‘结束’ |
-| confirm-text          | 底部确认按钮文案               | String          | ’确认‘ |
-| show-title          | 是否在展示日历标题               | Boolean          | true |
-| show-sub-title          | 是否展示日期标题              | Boolean          | true |
-| to-date-animation          | 是否启动滚动动画              | Boolean          | true |
-| first-day-of-week          | 设置周起始日              | 0-6          | 0 |
+| v-model:visible   | 是否可见                                          | boolean         | `false`           |
+| type              | 类型,日期单择'one',区间选择'range',日期多选'multiple'    | string          | '`one`'           |
+| poppable          | 是否弹窗状态展示                                  | boolean         | `true`            |
+| is-auto-back-fill | 自动回填                                          | boolean         | `false`           |
+| title             | 显示标题                                          | string          | `日期选择`      |
+| default-value     | 默认值,单个日期选择 string,其他为 Array  | string 、 array | `null`            |
+| start-date        | 开始日期         | string          | `今天`            |
+| end-date          | 结束日期              | string          | `距离今天 365 天` |
+| show-today          | 是否展示今天标记               | boolean          | `true` |
+| start-text         | 范围选择,开始信息文案               | string          | `开始` |
+| end-text         | 范围选择,结束信息文案               | string          | `结束` |
+| confirm-text          | 底部确认按钮文案               | string          | `确认` |
+| show-title          | 是否在展示日历标题               | boolean          | `true` |
+| show-sub-title          | 是否展示日期标题              | boolean          | `true` |
+| to-date-animation          | 是否启动滚动动画              | boolean          | `true` |
+| first-day-of-week          | 设置周起始日              | 0-6          | `0` |
 
 ### Events
 
@@ -639,22 +639,22 @@ export default {
 
 组件提供了下列 CSS 变量,可用于自定义样式,使用方法请参考 [ConfigProvider 组件](#/zh-CN/config-provider)。
 
-| 名称                                    | 默认值                     | 描述 |
-| --------------------------------------- | -------------------------- | ---- |
-| --nut-calendar-primary-color| _var(--nut-primary-color)_   | - |
-| --nut-calendar-choose-color| _var(--nut-active-color)_   | - |
-| --nut-calendar-choose-font-color| _var(--nut-primary-color)_   | - |
-| --nut-calendar-base-color| _#333333_   | - |
-| --nut-calendar-disable-color| _#d1d0d0_   | - |
-| --nut-calendar-base-font| _var(--nut-font-size-3)_   | - |
-| --nut-calendar-title-font| _var(--nut-font-size-4)_   | - |
-| --nut-calendar-title-font-weight| _500_   | - |
-| --nut-calendar-sub-title-font| _var(--nut-font-size-2)_   | - |
-| --nut-calendar-text-font| _var(--nut-font-size-1)_   | - |
-| --nut-calendar-day-font| _16px_   | - |
-| --nut-calendar-day-active-border-radius| _0px_   | - |
-| --nut-calendar-day-width| _14.28%_   | - |
-| --nut-calendar-day-height| _64px_   | - |
-| --nut-calendar-day-font-weight| _500_   | - |
-| --nut-calendar-day67-font-color| _var(--nut-primary-color)_   | - |
-| --nut-calendar-month-title-font-size| _inherit_   | - |
+| 名称                                    | 默认值                     | 
+| --------------------------------------- | -------------------------- | 
+| --nut-calendar-primary-color| _var(--nut-primary-color)_   |
+| --nut-calendar-choose-color| _var(--nut-active-color)_   |
+| --nut-calendar-choose-font-color| _var(--nut-primary-color)_   |
+| --nut-calendar-base-color| _#333333_   |
+| --nut-calendar-disable-color| _#d1d0d0_   |
+| --nut-calendar-base-font| _var(--nut-font-size-3)_   |
+| --nut-calendar-title-font| _var(--nut-font-size-4)_   |
+| --nut-calendar-title-font-weight| _500_   |
+| --nut-calendar-sub-title-font| _var(--nut-font-size-2)_   |
+| --nut-calendar-text-font| _var(--nut-font-size-1)_   |
+| --nut-calendar-day-font| _16px_   |
+| --nut-calendar-day-active-border-radius| _0px_   |
+| --nut-calendar-day-width| _14.28%_   |
+| --nut-calendar-day-height| _64px_   |
+| --nut-calendar-day-font-weight| _500_   |
+| --nut-calendar-day67-font-color| _var(--nut-primary-color)_   |
+| --nut-calendar-month-title-font-size| _inherit_   |

+ 35 - 35
src/packages/__VUE/calendar/doc.taro.md

@@ -588,22 +588,22 @@ export default {
 
 | 字段              | 说明                                              | 类型            | 默认值          |
 |-------------------|---------------------------------------------------|-----------------|-----------------|
-| v-model:visible   | 是否可见                                          | Boolean         | false           |
-| type              | 类型,日期单择'one',区间选择'range',日期多选'multiple'    | String          | 'one'           |
-| poppable          | 是否弹窗状态展示                                  | Boolean         | true            |
-| is-auto-back-fill | 自动回填                                          | Boolean         | false           |
-| title             | 显示标题                                          | String          | ‘日期选择’      |
-| default-value     | 默认值,单个日期选择 String,其他为 Array  | String 、 Array | null            |
-| start-date        | 开始日期         | String          | 今天            |
-| end-date          | 结束日期              | String          | 距离今天 365 天 |
-| show-today          | 是否展示今天标记               | Boolean          | true |
-| start-text         | 范围选择,开始信息文案               | String          | ’开始‘ |
-| end-text         | 范围选择,结束信息文案               | String          | ‘结束’ |
-| confirm-text          | 底部确认按钮文案               | String          | ’确认‘ |
-| show-title          | 是否在展示日历标题               | Boolean          | true |
-| show-sub-title          | 是否展示日期标题              | Boolean          | true |
-| to-date-animation          | 是否启动滚动动画              | Boolean          | true |
-| first-day-of-week          | 设置周起始日              | 0-6          | 0 |
+| v-model:visible   | 是否可见                                          | boolean         | `false`           |
+| type              | 类型,日期单择'one',区间选择'range',日期多选'multiple'    | string          | `one`          |
+| poppable          | 是否弹窗状态展示                                  | boolean         | `true`            |
+| is-auto-back-fill | 自动回填                                          | boolean         | `false`           |
+| title             | 显示标题                                          | string          | `日期选择`      |
+| default-value     | 默认值,单个日期选择 string,其他为 Array  | string 、 Array | `null`            |
+| start-date        | 开始日期         | string          | 今天            |
+| end-date          | 结束日期              | string          | 距离今天 365 天 |
+| show-today          | 是否展示今天标记               | boolean          | `true` |
+| start-text         | 范围选择,开始信息文案               | string          | `开始` |
+| end-text         | 范围选择,结束信息文案               | string          | `结束` |
+| confirm-text          | 底部确认按钮文案               | string          | `确认` |
+| show-title          | 是否在展示日历标题               | boolean          | `true` |
+| show-sub-title          | 是否展示日期标题              | boolean          | `true` |
+| to-date-animation          | 是否启动滚动动画              | boolean          | `true` |
+| first-day-of-week          | 设置周起始日              | 0-6          | `0` |
 
 ### Events
 
@@ -640,23 +640,23 @@ export default {
 
 组件提供了下列 CSS 变量,可用于自定义样式,使用方法请参考 [ConfigProvider 组件](#/zh-CN/config-provider)。
 
-| 名称                                    | 默认值                     | 描述 |
-| --------------------------------------- | -------------------------- | ---- |
-| --nut-calendar-primary-color| _var(--nut-primary-color)_   | - |
-| --nut-calendar-choose-color| _var(--nut-active-color)_   | - |
-| --nut-calendar-choose-font-color| _var(--nut-primary-color)_   | - |
-| --nut-calendar-base-color| _#333333_   | - |
-| --nut-calendar-disable-color| _#d1d0d0_   | - |
-| --nut-calendar-base-font| _var(--nut-font-size-3)_   | - |
-| --nut-calendar-title-font| _var(--nut-font-size-4)_   | - |
-| --nut-calendar-title-font-weight| _500_   | - |
-| --nut-calendar-sub-title-font| _var(--nut-font-size-2)_   | - |
-| --nut-calendar-text-font| _var(--nut-font-size-1)_   | - |
-| --nut-calendar-day-font| _16px_   | - |
-| --nut-calendar-day-active-border-radius| _0px_   | - |
-| --nut-calendar-day-width| _14.28%_   | - |
-| --nut-calendar-day-height| _64px_   | - |
-| --nut-calendar-day-font-weight| _500_   | - |
-| --nut-calendar-day67-font-color| _var(--nut-primary-color)_   | - |
-| --nut-calendar-month-title-font-size| _inherit_   | - |
+| 名称                                    | 默认值                     | 
+| --------------------------------------- | -------------------------- | 
+| --nut-calendar-primary-color| _var(--nut-primary-color)_   |
+| --nut-calendar-choose-color| _var(--nut-active-color)_   |
+| --nut-calendar-choose-font-color| _var(--nut-primary-color)_   |
+| --nut-calendar-base-color| _#333333_   |
+| --nut-calendar-disable-color| _#d1d0d0_   |
+| --nut-calendar-base-font| _var(--nut-font-size-3)_   |
+| --nut-calendar-title-font| _var(--nut-font-size-4)_   |
+| --nut-calendar-title-font-weight| _500_   |
+| --nut-calendar-sub-title-font| _var(--nut-font-size-2)_   |
+| --nut-calendar-text-font| _var(--nut-font-size-1)_   |
+| --nut-calendar-day-font| _16px_   |
+| --nut-calendar-day-active-border-radius| _0px_   |
+| --nut-calendar-day-width| _14.28%_   |
+| --nut-calendar-day-height| _64px_   |
+| --nut-calendar-day-font-weight| _500_   |
+| --nut-calendar-day67-font-color| _var(--nut-primary-color)_   |
+| --nut-calendar-month-title-font-size| _inherit_   |
 

+ 23 - 23
src/packages/__VUE/range/doc.en-US.md

@@ -378,19 +378,19 @@ export default {
   
 | Attribute | Description | Type | Default |
 | --- | --- | --- | --- |
-| v-model | current progress percentage | Number、Number[] | `0` |
-| range | Whether to enable dual slider mode | Boolean | `false` |
-| max | maximum  | Number、String | `100` |
-| min | minimum  | Number、String | `0` |
-| step | step size | Number、String | `1` |
-| disabled | Whether to disable the slider | Boolean | `false` |
-| vertical | Whether to display vertically | Boolean | `false` |
-| hidden-range | whether to hide range values | Boolean | `false` |
-| hidden-tag | whether to hide the label | Boolean | `false` |
-| active-color | progress bar active color | String | `rgba(250, 44, 25, 1)` |
-| inactive-color | Progress bar inactive color | String | `rgba(255, 163, 154, 1)` |
-| button-color | button color | String | `rgba(250, 44, 25, 1)` |
-| marks | scale mark | Object{key:number} | {} |
+| v-model | current progress percentage | number、number[] | `0` |
+| range | Whether to enable dual slider mode | boolean | `false` |
+| max | maximum  | number、string | `100` |
+| min | minimum  | number、string | `0` |
+| step | step size | number、string | `1` |
+| disabled | Whether to disable the slider | boolean | `false` |
+| vertical | Whether to display vertically | boolean | `false` |
+| hidden-range | whether to hide range values | boolean | `false` |
+| hidden-tag | whether to hide the label | boolean | `false` |
+| active-color | progress bar active color | string | `rgba(250, 44, 25, 1)` |
+| inactive-color | Progress bar inactive color | string | `rgba(255, 163, 154, 1)` |
+| button-color | button color | string | `rgba(250, 44, 25, 1)` |
+| marks | scale mark | object{key:number} | `{}` |
 
   
 ### Events
@@ -413,14 +413,14 @@ export default {
 
 The component provides the following CSS variables, which can be used to customize styles. Please refer to [ConfigProvider component](#/en-US/config-provider).
 
-| Name | Default Value | Description |
-| --------------------------------------- | -------------------------- | ---- |
-|  --nut-range-tip-font-color| _#333333_  |  -  |
-|  --nut-range-bg-color| _var(--nut-active-color)_  |  -  |
-|  --nut-range-bg-color-tick| _#fa958c_  |  -  |
-|  --nut-range-bar-bg-color| _linear-gradient(135deg, var(--nut-primary-color) 0%, var(--nut-primary-color-end) 100%)_  |  -  |
-|  --nut-range-bar-btn-bg-color| _var(--nut-white)_  |  -  |
-|  --nut-range-bar-btn-width| _24px_  |  -  |
-|  --nut-range-bar-btn-height| _24px_  |  -  |
-|  --nut-range-bar-btn-border| _1px solid var(--nut-primary-color)_  |  -  |
+| Name | Default Value | 
+| --------------------------------------- | -------------------------- | 
+|  --nut-range-tip-font-color| _#333333_  |
+|  --nut-range-bg-color| _var(--nut-active-color)_  |
+|  --nut-range-bg-color-tick| _#fa958c_  |
+|  --nut-range-bar-bg-color| _linear-gradient(135deg, var(--nut-primary-color) 0%, var(--nut-primary-color-end) 100%)_  |
+|  --nut-range-bar-btn-bg-color| _var(--nut-white)_  |
+|  --nut-range-bar-btn-width| _24px_  |
+|  --nut-range-bar-btn-height| _24px_  |
+|  --nut-range-bar-btn-border| _1px solid var(--nut-primary-color)_  |
 

+ 23 - 23
src/packages/__VUE/range/doc.md

@@ -380,19 +380,19 @@ export default {
   
 | 参数 | 说明 | 类型 | 默认值 |
 | --- | --- | --- | --- |
-| v-model | 当前进度百分比 | Number、Number[] | `0` |
-| range | 是否开启双滑块模式 | Boolean | `false` |
-| max | 最大值 | Number、String | `100` |
-| min | 最小值 | Number、String | `0` |
-| step | 步长 | Number、String | `1` |
-| disabled | 是否禁用滑块 | Boolean | `false` |
-| vertical | 是否竖向展示 | Boolean | `false` |
-| hidden-range | 是否隐藏范围值 | Boolean | `false` |
-| hidden-tag | 是否隐藏标签 | Boolean | `false` |
-| active-color | 进度条激活态颜色 | String | `rgba(250, 44, 25, 1)` |
-| inactive-color | 进度条非激活态颜色 | String | `rgba(255, 163, 154, 1)` |
-| button-color | 按钮颜色 | String | `rgba(250, 44, 25, 1)` |
-| marks | 刻度标示 | Object{key:number} | {} |
+| v-model | 当前进度百分比 | number、number[] | `0` |
+| range | 是否开启双滑块模式 | boolean | `false` |
+| max | 最大值 | number、string | `100` |
+| min | 最小值 | number、string | `0` |
+| step | 步长 | number、string | `1` |
+| disabled | 是否禁用滑块 | boolean | `false` |
+| vertical | 是否竖向展示 | boolean | `false` |
+| hidden-range | 是否隐藏范围值 | boolean | `false` |
+| hidden-tag | 是否隐藏标签 | boolean | `false` |
+| active-color | 进度条激活态颜色 | string | `rgba(250, 44, 25, 1)` |
+| inactive-color | 进度条非激活态颜色 | string | `rgba(255, 163, 154, 1)` |
+| button-color | 按钮颜色 | string | `rgba(250, 44, 25, 1)` |
+| marks | 刻度标示 | object{key:number} | `{}` |
 
   
 ### Events
@@ -416,14 +416,14 @@ export default {
 
 组件提供了下列 CSS 变量,可用于自定义样式,使用方法请参考 [ConfigProvider 组件](#/zh-CN/config-provider)。
 
-| 名称                                    | 默认值                     | 描述 |
-| --------------------------------------- | -------------------------- | ---- |
-|  --nut-range-tip-font-color| _#333333_  |  -  |
-|  --nut-range-bg-color| _var(--nut-active-color)_  |  -  |
-|  --nut-range-bg-color-tick| _#fa958c_  |  -  |
-|  --nut-range-bar-bg-color| _linear-gradient(135deg, var(--nut-primary-color) 0%, var(--nut-primary-color-end) 100%)_  |  -  |
-|  --nut-range-bar-btn-bg-color| _var(--nut-white)_  |  -  |
-|  --nut-range-bar-btn-width| _24px_  |  -  |
-|  --nut-range-bar-btn-height| _24px_  |  -  |
-|  --nut-range-bar-btn-border| _1px solid var(--nut-primary-color)_  |  -  |
+| 名称                                    | 默认值                     | 
+| --------------------------------------- | -------------------------- | 
+|  --nut-range-tip-font-color| _#333333_  | 
+|  --nut-range-bg-color| _var(--nut-active-color)_  | 
+|  --nut-range-bg-color-tick| _#fa958c_  | 
+|  --nut-range-bar-bg-color| _linear-gradient(135deg, var(--nut-primary-color) 0%, var(--nut-primary-color-end) 100%)_  | 
+|  --nut-range-bar-btn-bg-color| _var(--nut-white)_  | 
+|  --nut-range-bar-btn-width| _24px_  | 
+|  --nut-range-bar-btn-height| _24px_  | 
+|  --nut-range-bar-btn-border| _1px solid var(--nut-primary-color)_  | 
 

+ 23 - 23
src/packages/__VUE/range/doc.taro.md

@@ -380,19 +380,19 @@ export default {
   
 | 参数 | 说明 | 类型 | 默认值 |
 | --- | --- | --- | --- |
-| v-model | 当前进度百分比 | Number、Number[] | `0` |
-| range | 是否开启双滑块模式 | Boolean | `false` |
-| max | 最大值 | Number、String | `100` |
-| min | 最小值 | Number、String | `0` |
-| step | 步长 | Number、String | `1` |
-| disabled | 是否禁用滑块 | Boolean | `false` |
-| vertical | 是否竖向展示 | Boolean | `false` |
-| hidden-range | 是否隐藏范围值 | Boolean | `false` |
-| hidden-tag | 是否隐藏标签 | Boolean | `false` |
-| active-color | 进度条激活态颜色 | String | `rgba(250, 44, 25, 1)` |
-| inactive-color | 进度条非激活态颜色 | String | `rgba(255, 163, 154, 1)` |
-| button-color | 按钮颜色 | String | `rgba(250, 44, 25, 1)` |
-| marks | 刻度标示 | Object{key:number} | {} |
+| v-model | 当前进度百分比 | number、number[] | `0` |
+| range | 是否开启双滑块模式 | boolean | `false` |
+| max | 最大值 | number、string | `100` |
+| min | 最小值 | number、string | `0` |
+| step | 步长 | number、string | `1` |
+| disabled | 是否禁用滑块 | boolean | `false` |
+| vertical | 是否竖向展示 | boolean | `false` |
+| hidden-range | 是否隐藏范围值 | boolean | `false` |
+| hidden-tag | 是否隐藏标签 | boolean | `false` |
+| active-color | 进度条激活态颜色 | string | `rgba(250, 44, 25, 1)` |
+| inactive-color | 进度条非激活态颜色 | string | `rgba(255, 163, 154, 1)` |
+| button-color | 按钮颜色 | string | `rgba(250, 44, 25, 1)` |
+| marks | 刻度标示 | object{key:number} | `{}` |
 
   
 ### Events
@@ -415,13 +415,13 @@ export default {
 
 组件提供了下列 CSS 变量,可用于自定义样式,使用方法请参考 [ConfigProvider 组件](#/zh-CN/config-provider)。
 
-| 名称                                    | 默认值                     | 描述 |
-| --------------------------------------- | -------------------------- | ---- |
-|  --nut-range-tip-font-color| _#333333_  |  -  |
-|  --nut-range-bg-color| _var(--nut-active-color)_  |  -  |
-|  --nut-range-bg-color-tick| _#fa958c_  |  -  |
-|  --nut-range-bar-bg-color| _linear-gradient(135deg, var(--nut-primary-color) 0%, var(--nut-primary-color-end) 100%)_  |  -  |
-|  --nut-range-bar-btn-bg-color| _var(--nut-white)_  |  -  |
-|  --nut-range-bar-btn-width| _24px_  |  -  |
-|  --nut-range-bar-btn-height| _24px_  |  -  |
-|  --nut-range-bar-btn-border| _1px solid var(--nut-primary-color)_  |  -  |
+| 名称                                    | 默认值                     |
+| --------------------------------------- | -------------------------- |
+|  --nut-range-tip-font-color| _#333333_  |
+|  --nut-range-bg-color| _var(--nut-active-color)_  |
+|  --nut-range-bg-color-tick| _#fa958c_  |
+|  --nut-range-bar-bg-color| _linear-gradient(135deg, var(--nut-primary-color) 0%, var(--nut-primary-color-end) 100%)_  |
+|  --nut-range-bar-btn-bg-color| _var(--nut-white)_  |
+|  --nut-range-bar-btn-width| _24px_  |
+|  --nut-range-bar-btn-height| _24px_  |
+|  --nut-range-bar-btn-border| _1px solid var(--nut-primary-color)_  |

+ 17 - 8
src/packages/__VUE/range/index.taro.vue

@@ -2,11 +2,13 @@
   <view :class="containerClasses">
     <view class="nut-range-min" v-if="!hiddenRange">{{ +min }}</view>
     <view ref="root" :id="'root-' + refRandomId" :style="wrapperStyle" :class="classes" @click.stop="onClick">
-      <view class="nut-range-mark" v-if="marksList.length > 0">
-        <span v-for="marks in marksList" :key="marks" :class="markClassName(marks)" :style="marksStyle(marks)">
-          {{ marks }}
-          <span class="nut-range-tick" :style="tickStyle(marks)"></span>
-        </span>
+      <view class="nut-range-mark">
+        <template v-if="marksList.length > 0">
+          <span v-for="marks in marksList" :key="marks" :class="markClassName(marks)" :style="marksStyle(marks)">
+            {{ marks }}
+            <span class="nut-range-tick" :style="tickStyle(marks)"></span>
+          </span>
+        </template>
       </view>
       <view class="nut-range-bar" :style="barStyle">
         <template v-if="range">
@@ -296,13 +298,20 @@ export default create({
       if (props.disabled) {
         return;
       }
-
       const { min, modelValue } = props;
       const rect = await useTaroRect(root, Taro);
-      let delta = event.touches[0].clientX - rect.left;
+      let clientX, clientY;
+      if (Taro.getEnv() === Taro.ENV_TYPE.WEB) {
+        clientX = event.clientX;
+        clientY = event.clientY;
+      } else {
+        clientX = event.touches[0].clientX;
+        clientY = event.touches[0].clientY;
+      }
+      let delta = clientX - rect.left;
       let total = rect.width;
       if (props.vertical) {
-        delta = event.touches[0].clientY - rect.top;
+        delta = clientY - rect.top;
         total = rect.height;
       }
       const value = Number(min) + (delta / total) * scope.value;

+ 14 - 14
src/packages/__VUE/trendarrow/doc.en-US.md

@@ -151,15 +151,15 @@ app.use(TrendArrow);
 
 | Attribute         | Description                             | Type   | Default           |
 |--------------|----------------------------------|--------|------------------|
-| rate         | Value, the arrow is up when it is greater than 0, and the arrow is down when it is less than 0    | Number | -                |
-| digits         | decimal precision               | Number | 2               |
-| show-sign         | Whether to display plus and minus signs               | Boolean | false               |
-| show-zero         |whether to show 0               | Boolean | false               |
-| arrow-left        | whether to show an arrow to the left of the number     | Boolean | false               |
-| sync-text-color   | Whether the text color is in sync with the arrow               | Boolean | true   |
-| text-color        | text color               | String | '#333333'               |
-| rise-color         | up arrow color               | String | '#fa2c19'               |
-| drop-color         | down arrow color               | String | ‘#64b578’               |
+| rate         | Value, the arrow is up when it is greater than 0, and the arrow is down when it is less than 0    | number | -                |
+| digits         | decimal precision               | number | `2`               |
+| show-sign         | Whether to display plus and minus signs               | boolean | `false`               |
+| show-zero         |whether to show 0               | boolean | `false`               |
+| arrow-left        | whether to show an arrow to the left of the number     | boolean | `false`               |
+| sync-text-color   | Whether the text color is in sync with the arrow               | boolean | `true`   |
+| text-color        | text color               | string | `#333333`               |
+| rise-color         | up arrow color               | string | `#fa2c19`            |
+| drop-color         | down arrow color               | string | `#64b578`           |
 
 ### Slots
 
@@ -174,8 +174,8 @@ app.use(TrendArrow);
 
 The component provides the following CSS variables, which can be used to customize styles. Please refer to [ConfigProvider component](#/en-US/config-provider).
 
-| Name | Default Value | Description |
-| --------------------------------------- | -------------------------- | ---- |
-| --nut-trendarrow-font-size| _14px_  | -  |
-| --nut-trendarrow-before-icon-margin| _4px_  | -  |
-| --nut-trendarrow-icon-width| _12px_  | -  |
+| Name | Default Value | 
+| --------------------------------------- | -------------------------- | 
+| --nut-trendarrow-font-size| _14px_   |
+| --nut-trendarrow-before-icon-margin| _4px_   |
+| --nut-trendarrow-icon-width| _12px_   |

+ 14 - 14
src/packages/__VUE/trendarrow/doc.md

@@ -153,15 +153,15 @@ app.use(TrendArrow);
 
 | 参数         | 说明                             | 类型   | 默认值           |
 |--------------|----------------------------------|--------|------------------|
-| rate         | 数值,大于0时箭头向上,小于0时箭头向下    | Number | -                |
-| digits         | 小数位精度               | Number | 2               |
-| show-sign         | 是否显示加减号               | Boolean | false               |
-| show-zero         | 是否显示 0               | Boolean | false               |
-| arrow-left        | 是否在数字左侧显示箭头     | Boolean | false               |
-| sync-text-color   | 文字颜色是否与箭头同步               | Boolean | true   |
-| text-color        | 文字颜色               | String | '#333333'               |
-| rise-color         | 向上箭头颜色               | String | '#fa2c19'               |
-| drop-color         | 向下箭头颜色               | String | ‘#64b578’               |
+| rate         | 数值,大于0时箭头向上,小于0时箭头向下    | number | `-`                |
+| digits         | 小数位精度               | number | `2`               |
+| show-sign         | 是否显示加减号               | boolean | `false`               |
+| show-zero         | 是否显示 0               | boolean | `false`               |
+| arrow-left        | 是否在数字左侧显示箭头     | boolean | `false`               |
+| sync-text-color   | 文字颜色是否与箭头同步               | boolean | `true`   |
+| text-color        | 文字颜色               | string | `#333333`               |
+| rise-color         | 向上箭头颜色               | string | `#fa2c19`               |
+| drop-color         | 向下箭头颜色               | string | `#64b578`               |
 
 ### Slots
 
@@ -176,8 +176,8 @@ app.use(TrendArrow);
 
 组件提供了下列 CSS 变量,可用于自定义样式,使用方法请参考 [ConfigProvider 组件](#/zh-CN/config-provider)。
 
-| 名称                                    | 默认值                     | 描述 |
-| --------------------------------------- | -------------------------- | ---- |
-| --nut-trendarrow-font-size| _14px_  | -  |
-| --nut-trendarrow-before-icon-margin| _4px_  | -  |
-| --nut-trendarrow-icon-width| _12px_  | -  |
+| 名称                                    | 默认值                     | 
+| --------------------------------------- | -------------------------- | 
+| --nut-trendarrow-font-size| _14px_  |
+| --nut-trendarrow-before-icon-margin| _4px_  |
+| --nut-trendarrow-icon-width| _12px_  | 

+ 14 - 14
src/packages/__VUE/trendarrow/doc.taro.md

@@ -153,15 +153,15 @@ app.use(TrendArrow);
 
 | 参数         | 说明                             | 类型   | 默认值           |
 |--------------|----------------------------------|--------|------------------|
-| rate         | 数值,大于0时箭头向上,小于0时箭头向下    | Number | -                |
-| digits         | 小数位精度               | Number | 2               |
-| show-sign         | 是否显示加减号               | Boolean | false               |
-| show-zero         | 是否显示 0               | Boolean | false               |
-| arrow-left        | 是否在数字左侧显示箭头     | Boolean | false               |
-| sync-text-color   | 文字颜色是否与箭头同步               | Boolean | true   |
-| text-color        | 文字颜色               | String | '#333333'               |
-| rise-color         | 向上箭头颜色               | String | '#fa2c19'               |
-| drop-color         | 向下箭头颜色               | String | ‘#64b578’               |
+| rate         | 数值,大于0时箭头向上,小于0时箭头向下    | number | `-`|
+| digits         | 小数位精度               | number | `2`               |
+| show-sign         | 是否显示加减号               | boolean | `false`               |
+| show-zero         | 是否显示 0               | boolean | `false`               |
+| arrow-left        | 是否在数字左侧显示箭头     | boolean | `false`               |
+| sync-text-color   | 文字颜色是否与箭头同步               | boolean | `true`   |
+| text-color        | 文字颜色               | string | `#333333`               |
+| rise-color         | 向上箭头颜色               | string | `#fa2c19`               |
+| drop-color         | 向下箭头颜色               | string | `#64b578`               |
 
 ### Slots
 
@@ -176,8 +176,8 @@ app.use(TrendArrow);
 
 组件提供了下列 CSS 变量,可用于自定义样式,使用方法请参考 [ConfigProvider 组件](#/zh-CN/config-provider)。
 
-| 名称                                    | 默认值                     | 描述 |
-| --------------------------------------- | -------------------------- | ---- |
-| --nut-trendarrow-font-size| _14px_  | -  |
-| --nut-trendarrow-before-icon-margin| _4px_  | -  |
-| --nut-trendarrow-icon-width| _12px_  | -  |
+| 名称                                    | 默认值                     | 
+| --------------------------------------- | -------------------------- | 
+| --nut-trendarrow-font-size| _14px_   |
+| --nut-trendarrow-before-icon-margin| _4px_   |
+| --nut-trendarrow-icon-width| _12px_   |

+ 17 - 17
src/packages/__VUE/watermark/doc.en-US.md

@@ -106,20 +106,20 @@ app.use(Watermark);
 ### Props
 | Attribute         | Description                             | Type   | Default           |
 |--------------|----------------------------------|--------|------------------|
-| width       | Width of watermark     | `number`           | `120`                |
-| height      | Height of watermark               | `number`           | `64`                 |
-| rotate      | Rotation angle when drawing watermark   | `number`           | `-22`                |
-| image       | Image source, it is recommended to export 2x or 3x images, and the image rendering watermark is preferred | `string`           | -                    |
-| image-width  | Width of image                                             | `number`           | `120`                |
-| image-height | Height of image                                             | `number`           | `64`                 |
-| z-index      | Z-index of the appended watermark element                             | `number`           | `2000`               |
-| content     | Watermark text content                                         | `string`           | -                    |
-| font-color   | Watermark text color                                         | `string`           | `rgba(0, 0, 0, .15)` |
-| font-size    | Watermark text font size                                             | `string \| number` | `16`                 |
-| gap-x        | Horizontal spacing between watermarks                                   | `number`           | `24`                 |
-| gap-y        | Vertical spacing between watermarks                                   | `number`           | `48`                 |
-| full-page    | Overwrite entire page                                     | `boolean`          | `true`               |
-| font-family  | Watermark text font family                  | `boolean`          | `true`               |
+| width       | Width of watermark     | number           | `120`                |
+| height      | Height of watermark               | number           | `64`                 |
+| rotate      | Rotation angle when drawing watermark   | number           | `-22`                |
+| image       | Image source, it is recommended to export 2x or 3x images, and the image rendering watermark is preferred | string           | -                    |
+| image-width  | Width of image                                             | number           | `120`                |
+| image-height | Height of image                                             | number           | `64`                 |
+| z-index      | Z-index of the appended watermark element                             | number           | `2000`               |
+| content     | Watermark text content                                         | string           | -                    |
+| font-color   | Watermark text color                                         | string           | `rgba(0, 0, 0, .15)` |
+| font-size    | Watermark text font size                                             | string \| number | `16`                 |
+| gap-x        | Horizontal spacing between watermarks                                   | number           | `24`                 |
+| gap-y        | Vertical spacing between watermarks                                   | number           | `48`                 |
+| full-page    | Overwrite entire page                                     | boolean          | `true`               |
+| font-family  | Watermark text font family                  | boolean          | `true`               |
 
 ## Theming
 
@@ -127,6 +127,6 @@ app.use(Watermark);
 
 The component provides the following CSS variables, which can be used to customize styles. Please refer to [ConfigProvider component](#/en-US/config-provider).
 
-| Name | Default Value | Description |
-| --------------------------------------- | -------------------------- | ---- |
-| --nut-watermark-z-index        | _ 2000_        | -    |
+| Name | Default Value | 
+| --------------------------------------- | -------------------------- | 
+| --nut-watermark-z-index        | _ 2000_        | 

+ 17 - 17
src/packages/__VUE/watermark/doc.md

@@ -111,20 +111,20 @@ app.use(Watermark);
 
 | 参数          | 说明                             | 类型   | 默认值           |
 |--------------|----------------------------------|--------|------------------|
-| width       | 水印的宽度                                           | `number`           | `120`                |
-| height      | 水印的高度                                           | `number`           | `64`                 |
-| rotate      | 水印绘制时,旋转的角度                  | `number`           | `-22`                |
-| image       | 图片源,建议导出 2 倍或 3 倍图,优先使用图片渲染水印 | `string`           | -                    |
-| image-width  | 图片宽度                                             | `number`           | `120`                |
-| image-height | 图片高度                                             | `number`           | `64`                 |
-| z-index      | 追加的水印元素的 z-index                             | `number`           | `2000`               |
-| content     | 水印文字内容                                         | `string`           | -                    |
-| font-color   | 水印文字颜色                                         | `string`           | `rgba(0, 0, 0, .15)` |
-| font-size    | 文字大小                                             | `string \| number` | `16`                 |
-| gap-x        | 水印之间的水平间距                                   | `number`           | `24`                 |
-| gap-y       | 水印之间的垂直间距                                   | `number`           | `48`                 |
-| full-page    | 是否覆盖整个页面                                     | `boolean`          | `true`               |
-| font-family  | 水印文字字体                                     | `boolean`          | `true`               |
+| width       | 水印的宽度                                           | number         | `120`                |
+| height      | 水印的高度                                           | number           | `64`                 |
+| rotate      | 水印绘制时,旋转的角度                  | number           | `-22`                |
+| image       | 图片源,建议导出 2 倍或 3 倍图,优先使用图片渲染水印 | string           | -                    |
+| image-width  | 图片宽度                                             | number           | `120`                |
+| image-height | 图片高度                                             | number           | `64`                 |
+| z-index      | 追加的水印元素的 z-index                             | number           | `2000`               |
+| content     | 水印文字内容                                         | string           | -                    |
+| font-color   | 水印文字颜色                                         | string           | `rgba(0, 0, 0, .15)` |
+| font-size    | 文字大小                                             | string \| number | `16`                 |
+| gap-x        | 水印之间的水平间距                                   | number           | `24`                 |
+| gap-y       | 水印之间的垂直间距                                   | number           | `48`                 |
+| full-page    | 是否覆盖整个页面                                     | boolean          | `true`               |
+| font-family  | 水印文字字体                                     | boolean          | `true`               |
 
 ## 主题定制
 
@@ -132,8 +132,8 @@ app.use(Watermark);
 
 组件提供了下列 CSS 变量,可用于自定义样式,使用方法请参考 [ConfigProvider 组件](#/zh-CN/config-provider)。
 
-| 名称                                    | 默认值                     | 描述 |
-| --------------------------------------- | -------------------------- | ---- |
-| --nut-watermark-z-index        | _ 2000_        | -    |
+| 名称                                    | 默认值                     | 
+| --------------------------------------- | -------------------------- | 
+| --nut-watermark-z-index        | _ 2000_        | 
 
 

+ 17 - 17
src/packages/__VUE/watermark/doc.taro.md

@@ -111,20 +111,20 @@ app.use(Watermark);
 
 | 参数          | 说明                             | 类型   | 默认值           |
 |--------------|----------------------------------|--------|------------------|
-| width       | 水印的宽度                                           | `number`           | `120`                |
-| height      | 水印的高度                                           | `number`           | `64`                 |
-| rotate      | 水印绘制时,旋转的角度                  | `number`           | `-22`                |
-| image       | 图片源,建议导出 2 倍或 3 倍图,优先使用图片渲染水印 | `string`           | -                    |
-| image-width  | 图片宽度                                             | `number`           | `120`                |
-| image-height | 图片高度                                             | `number`           | `64`                 |
-| z-index      | 追加的水印元素的 z-index                             | `number`           | `2000`               |
-| content     | 水印文字内容                                         | `string`           | -                    |
-| font-color   | 水印文字颜色                                         | `string`           | `rgba(0, 0, 0, .15)` |
-| font-size    | 文字大小                                             | `string \| number` | `16`                 |
-| gap-x        | 水印之间的水平间距                                   | `number`           | `24`                 |
-| gap-y       | 水印之间的垂直间距                                   | `number`           | `48`                 |
-| full-page    | 是否覆盖整个页面                                     | `boolean`          | `true`               |
-| font-family  | 水印文字字体                                     | `boolean`          | `true`               |
+| width       | 水印的宽度                                           | number           | `120`                |
+| height      | 水印的高度                                           | number           | `64`                 |
+| rotate      | 水印绘制时,旋转的角度                  | number           | `-22`                |
+| image       | 图片源,建议导出 2 倍或 3 倍图,优先使用图片渲染水印 | string           | -                    |
+| image-width  | 图片宽度                                             | number           | `120`                |
+| image-height | 图片高度                                             | number           | `64`                 |
+| z-index      | 追加的水印元素的 z-index                             | number           | `2000`               |
+| content     | 水印文字内容                                         | string           | -                    |
+| font-color   | 水印文字颜色                                         | string           | `rgba(0, 0, 0, .15)` |
+| font-size    | 文字大小                                             | string \| number | `16`                 |
+| gap-x        | 水印之间的水平间距                                   | number           | `24`                 |
+| gap-y       | 水印之间的垂直间距                                   | number           | `48`                 |
+| full-page    | 是否覆盖整个页面                                     | boolean          | `true`               |
+| font-family  | 水印文字字体                                     | boolean          | `true`               |
 
 ## 主题定制
 
@@ -132,8 +132,8 @@ app.use(Watermark);
 
 组件提供了下列 CSS 变量,可用于自定义样式,使用方法请参考 [ConfigProvider 组件](#/zh-CN/config-provider)。
 
-| 名称                                    | 默认值                     | 描述 |
-| --------------------------------------- | -------------------------- | ---- |
-| --nut-watermark-z-index        | _ 2000_        | -    |
+| 名称                                    | 默认值                     | 
+| --------------------------------------- | -------------------------- | 
+| --nut-watermark-z-index        | _ 2000_        |
 
 

+ 74 - 32
src/packages/__VUE/watermark/index.taro.vue

@@ -121,7 +121,7 @@ export default create({
       const canvasHeight = `${(gapY + height) * ratio}`;
       const markWidth = width * ratio;
       const markHeight = height * ratio;
-      const canvas: any = Taro.createOffscreenCanvas({
+      const canvas: Taro.OffscreenCanvas = Taro.createOffscreenCanvas({
         type: '2d',
         width: Number(canvasWidth),
         height: Number(canvasHeight)
@@ -130,45 +130,87 @@ export default create({
 
       if (ctx) {
         if (image) {
-          ctx.translate(markWidth / 2, markHeight / 2);
-          ctx.rotate((Math.PI / 180) * Number(rotate));
           // 创建一个图片
-          const img = canvas.createImage();
-
-          img.crossOrigin = 'anonymous';
-          img.referrerPolicy = 'no-referrer';
-          img.src = image; // 要加载的图片 url, 可以是base64
-          img.onload = () => {
-            ctx.drawImage(
-              img,
-              (-imageWidth * ratio) / 2,
-              (-imageHeight * ratio) / 2,
-              imageWidth * ratio,
-              imageHeight * ratio
-            );
-            ctx.restore();
-            state.base64Url = ctx.canvas.toDataURL();
-          };
+          const img = canvas.createImage() as HTMLImageElement;
+          dealWithImage(ctx, img, ratio, ctx.canvas, markWidth, markHeight);
         } else if (content) {
-          ctx.textBaseline = 'middle';
-          ctx.textAlign = 'center';
-          // 文字绕中间旋转
-          ctx.translate(markWidth / 2, markHeight / 2);
-          ctx.rotate((Math.PI / 180) * Number(rotate));
-
-          const markSize = Number(fontSize) * ratio;
-          ctx.font = `${fontStyle} normal ${fontWeight} ${markSize}px/${markHeight}px ${fontFamily}`;
-          ctx.fillStyle = fontColor;
+          dealWithText(ctx, ratio, ctx.canvas, markWidth, markHeight);
+        }
+      } else {
+        throw new Error('当前环境不支持Canvas');
+      }
+    };
+    const initH5 = () => {
+      const canvas = document.createElement('canvas');
+      const ratio = window.devicePixelRatio;
+      const ctx = canvas.getContext('2d');
+      const canvasWidth = `${(gapX + width) * ratio}px`;
+      const canvasHeight = `${(gapY + height) * ratio}px`;
+      const markWidth = width * ratio;
+      const markHeight = height * ratio;
+      canvas.setAttribute('width', canvasWidth);
+      canvas.setAttribute('height', canvasHeight);
 
-          ctx.fillText(content, 0, 0);
-          ctx.restore();
-          state.base64Url = ctx.canvas.toDataURL();
+      if (ctx) {
+        if (image) {
+          const img = new Image();
+          dealWithImage(ctx, img, ratio, canvas, markWidth, markHeight);
+        } else if (content) {
+          dealWithText(ctx, ratio, canvas, markWidth, markHeight);
         }
       } else {
         throw new Error('当前环境不支持Canvas');
       }
     };
-    init();
+    const dealWithImage = (
+      ctx: any,
+      img: HTMLImageElement,
+      ratio: number,
+      canvas: HTMLCanvasElement,
+      markWidth: number,
+      markHeight: number
+    ) => {
+      ctx.translate(markWidth / 2, markHeight / 2);
+      ctx.rotate((Math.PI / 180) * Number(rotate));
+      img.crossOrigin = 'anonymous';
+      img.referrerPolicy = 'no-referrer';
+      img.src = image; // 要加载的图片 url, 可以是base64
+      img.onload = () => {
+        ctx.drawImage(
+          img,
+          (-imageWidth * ratio) / 2,
+          (-imageHeight * ratio) / 2,
+          imageWidth * ratio,
+          imageHeight * ratio
+        );
+        ctx.restore();
+        state.base64Url = canvas.toDataURL();
+      };
+    };
+    const dealWithText = (
+      ctx: any,
+      ratio: number,
+      canvas: HTMLCanvasElement,
+      markWidth: number,
+      markHeight: number
+    ) => {
+      ctx.textBaseline = 'middle';
+      ctx.textAlign = 'center';
+      // 文字绕中间旋转
+      ctx.translate(markWidth / 2, markHeight / 2);
+      ctx.rotate((Math.PI / 180) * Number(rotate));
+      const markSize = Number(fontSize) * ratio;
+      ctx.font = `${fontStyle} normal ${fontWeight} ${markSize}px/${markHeight}px ${fontFamily}`;
+      ctx.fillStyle = fontColor;
+      ctx.fillText(content, 0, 0);
+      ctx.restore();
+      state.base64Url = canvas.toDataURL();
+    };
+    if (Taro.getEnv() === 'WEB') {
+      initH5();
+    } else {
+      init();
+    }
 
     watch(
       () => [

+ 16 - 2
src/sites/mobile-taro/vue/src/basic/pages/button/index.vue

@@ -35,8 +35,17 @@
     </div>
     <h2>图标按钮</h2>
     <div class="demo-button-row2">
-      <nut-button shape="square" plain type="primary" icon="star-fill"></nut-button>
-      <nut-button shape="square" type="primary" icon="star">收藏</nut-button>
+      <nut-button shape="square" plain type="primary">
+        <template #icon>
+          <StarFill />
+        </template>
+      </nut-button>
+      <nut-button shape="square" type="primary">
+        <template #icon>
+          <Star />
+        </template>
+        收藏
+      </nut-button>
     </div>
 
     <h2>按钮尺寸</h2>
@@ -61,8 +70,13 @@
 
 <script>
 import { ref } from 'vue';
+import { StarFill, Star } from '@nutui/icons-vue-taro';
 export default {
   props: {},
+  components: {
+    StarFill,
+    Star
+  },
   setup(props) {
     let isLoading = ref(false);
     const changeLoading = () => {

+ 1 - 0
src/sites/mobile-taro/vue/src/exhibition/pages/watermark/index.vue

@@ -51,6 +51,7 @@ export default defineComponent({
     background: #fff;
     > img {
       width: 100%;
+      max-height: 100%;
     }
     .mark1 {
       width: 100%;