Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
京东前端
nutui
提交
a84791d6
N
nutui
项目概览
京东前端
/
nutui
通知
37
Star
4
Fork
1
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
0
列表
看板
标记
里程碑
合并请求
0
DevOps
流水线
流水线任务
计划
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
N
nutui
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
0
Issue
0
列表
看板
标记
里程碑
合并请求
0
合并请求
0
Pages
DevOps
DevOps
流水线
流水线任务
计划
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
流水线任务
提交
Issue看板
前往新版Gitcode,体验更适合开发者的 AI 搜索 >>
未验证
提交
a84791d6
编写于
9月 05, 2022
作者:
L
lkjh3214
提交者:
GitHub
9月 05, 2022
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
fix(backtop,badge,button,popover,tag,watermark): 文档调整,demo修改 (#1624)
上级
508f84c8
变更
14
隐藏空白更改
内联
并排
Showing
14 changed file
with
92 addition
and
187 deletion
+92
-187
src/packages/__VUE/backtop/doc.en-US.md
src/packages/__VUE/backtop/doc.en-US.md
+22
-77
src/packages/__VUE/backtop/doc.md
src/packages/__VUE/backtop/doc.md
+23
-74
src/packages/__VUE/backtop/doc.taro.md
src/packages/__VUE/backtop/doc.taro.md
+10
-3
src/packages/__VUE/backtop/index.vue
src/packages/__VUE/backtop/index.vue
+1
-1
src/packages/__VUE/badge/doc.en-US.md
src/packages/__VUE/badge/doc.en-US.md
+1
-1
src/packages/__VUE/badge/doc.md
src/packages/__VUE/badge/doc.md
+1
-1
src/packages/__VUE/button/doc.en-US.md
src/packages/__VUE/button/doc.en-US.md
+2
-2
src/packages/__VUE/popover/demo.vue
src/packages/__VUE/popover/demo.vue
+4
-4
src/packages/__VUE/popover/doc.en-US.md
src/packages/__VUE/popover/doc.en-US.md
+3
-1
src/packages/__VUE/popover/doc.md
src/packages/__VUE/popover/doc.md
+3
-1
src/packages/__VUE/tag/doc.en-US.md
src/packages/__VUE/tag/doc.en-US.md
+2
-2
src/packages/__VUE/tag/doc.md
src/packages/__VUE/tag/doc.md
+2
-2
src/packages/__VUE/watermark/doc.en-US.md
src/packages/__VUE/watermark/doc.en-US.md
+9
-9
src/packages/__VUE/watermark/doc.md
src/packages/__VUE/watermark/doc.md
+9
-9
未找到文件。
src/packages/__VUE/backtop/doc.en-US.md
浏览文件 @
a84791d6
...
...
@@ -48,10 +48,22 @@ app.use(Icon);
<div
class=
"text-data"
>
test data22
</div>
<div
class=
"text-data"
>
test data23
</div>
<div
class=
"text-data"
>
test data24
</div>
<nut-backtop
></nut-backtop>
<nut-backtop
@
click=
"handleClick"
></nut-backtop>
</div>
</template>
<script>
export
default
{
setup
()
{
const
handleClick
=
()
=>
{
console
.
log
(
'
backtop
'
);
};
return
{
handleClick
};
}
};
</script>
<style
lang=
"scss"
scoped
>
.demo
{
.text-data
{
...
...
@@ -189,82 +201,9 @@ app.use(Icon);
</style>
```
:::
### Click
:::demo
```
html
<template>
<div
class=
"demo"
id=
"elId"
>
<div
class=
"text-data"
>
test data1
</div>
<div
class=
"text-data"
>
test data2
</div>
<div
class=
"text-data"
>
test data3
</div>
<div
class=
"text-data"
>
test data4
</div>
<div
class=
"text-data"
>
test data5
</div>
<div
class=
"text-data"
>
test data6
</div>
<div
class=
"text-data"
>
test data7
</div>
<div
class=
"text-data"
>
test data8
</div>
<div
class=
"text-data"
>
test data9
</div>
<div
class=
"text-data"
>
test data10
</div>
<div
class=
"text-data"
>
test data11
</div>
<div
class=
"text-data"
>
test data12
</div>
<div
class=
"text-data"
>
test data13
</div>
<div
class=
"text-data"
>
test data14
</div>
<div
class=
"text-data"
>
test data15
</div>
<div
class=
"text-data"
>
test data16
</div>
<div
class=
"text-data"
>
test data17
</div>
<div
class=
"text-data"
>
test data18
</div>
<div
class=
"text-data"
>
test data19
</div>
<div
class=
"text-data"
>
test data20
</div>
<div
class=
"text-data"
>
test data21
</div>
<div
class=
"text-data"
>
test data22
</div>
<div
class=
"text-data"
>
test data23
</div>
<div
class=
"text-data"
>
test data24
</div>
<nut-backtop
@
click=
"handleClick"
></nut-backtop>
</div>
</template>
<script>
export
default
{
setup
()
{
const
handleClick
=
()
=>
{
console
.
log
(
'
backtop
'
);
};
return
{
handleClick
};
}
};
</script>
<style
lang=
"scss"
scoped
>
.demo
{
.text-data
{
margin
:
0
auto
;
margin-top
:
15px
;
margin-bottom
:
20px
;
padding-left
:
16px
;
display
:
flex
;
align-items
:
center
;
width
:
100%
;
height
:
46px
;
background
:
rgba
(
255
,
255
,
255
,
1
);
border-radius
:
7px
;
box-shadow
:
0px
1px
7px
0px
rgba
(
237
,
238
,
241
,
1
);
line-height
:
19px
;
font-size
:
13px
;
color
:
rgba
(
102
,
102
,
102
,
1
);
}
}
</style>
```
:::
### API
### Prop
### Prop
s
| Attribute | Description | Type | Default |
|-----------------|------------------------------------------|---------|---------|
...
...
@@ -276,7 +215,13 @@ app.use(Icon);
| is-animation | Whether there is animation, mutually exclusive with the duration parameter | Boolean |
`true`
|
| duration | Set animation duration | Number |
`1000`
|
### Event
### Event
s
| Event | Description | Arguments |
|-------|----------|-------------|
| click | Emitted when component is clicked | event: MouseEvent |
\ No newline at end of file
| click | Emitted when component is clicked | event: MouseEvent |
### Slots
| Name | Description |
|---------|--------------|
| default | The default slot is used to customize the content |
\ No newline at end of file
src/packages/__VUE/backtop/doc.md
浏览文件 @
a84791d6
...
...
@@ -48,10 +48,23 @@ app.use(Icon);
<div
class=
"text-data"
>
我是测试数据22
</div>
<div
class=
"text-data"
>
我是测试数据23
</div>
<div
class=
"text-data"
>
我是测试数据24
</div>
<nut-backtop
></nut-backtop>
<nut-backtop
@
click=
"handleClick"
></nut-backtop>
</div>
</template>
<script>
export
default
{
setup
()
{
const
handleClick
=
()
=>
{
console
.
log
(
'
触发返回顶部
'
);
};
return
{
handleClick
};
}
};
</script>
<style
lang=
"scss"
scoped
>
.demo
{
.text-data
{
...
...
@@ -190,81 +203,11 @@ app.use(Icon);
```
:::
### click事件
:::demo
```
html
<template>
<div
class=
"demo"
id=
"elId"
>
<div
class=
"text-data"
>
我是测试数据1
</div>
<div
class=
"text-data"
>
我是测试数据2
</div>
<div
class=
"text-data"
>
我是测试数据3
</div>
<div
class=
"text-data"
>
我是测试数据4
</div>
<div
class=
"text-data"
>
我是测试数据5
</div>
<div
class=
"text-data"
>
我是测试数据6
</div>
<div
class=
"text-data"
>
我是测试数据7
</div>
<div
class=
"text-data"
>
我是测试数据8
</div>
<div
class=
"text-data"
>
我是测试数据9
</div>
<div
class=
"text-data"
>
我是测试数据10
</div>
<div
class=
"text-data"
>
我是测试数据11
</div>
<div
class=
"text-data"
>
我是测试数据12
</div>
<div
class=
"text-data"
>
我是测试数据13
</div>
<div
class=
"text-data"
>
我是测试数据14
</div>
<div
class=
"text-data"
>
我是测试数据15
</div>
<div
class=
"text-data"
>
我是测试数据16
</div>
<div
class=
"text-data"
>
我是测试数据17
</div>
<div
class=
"text-data"
>
我是测试数据18
</div>
<div
class=
"text-data"
>
我是测试数据19
</div>
<div
class=
"text-data"
>
我是测试数据20
</div>
<div
class=
"text-data"
>
我是测试数据21
</div>
<div
class=
"text-data"
>
我是测试数据22
</div>
<div
class=
"text-data"
>
我是测试数据23
</div>
<div
class=
"text-data"
>
我是测试数据24
</div>
<nut-backtop
@
click=
"handleClick"
></nut-backtop>
</div>
</template>
<script>
export
default
{
setup
()
{
const
handleClick
=
()
=>
{
console
.
log
(
'
触发返回顶部
'
);
};
return
{
handleClick
};
}
};
</script>
<style
lang=
"scss"
scoped
>
.demo
{
.text-data
{
margin
:
0
auto
;
margin-top
:
15px
;
margin-bottom
:
20px
;
padding-left
:
16px
;
display
:
flex
;
align-items
:
center
;
width
:
100%
;
height
:
46px
;
background
:
rgba
(
255
,
255
,
255
,
1
);
border-radius
:
7px
;
box-shadow
:
0px
1px
7px
0px
rgba
(
237
,
238
,
241
,
1
);
line-height
:
19px
;
font-size
:
13px
;
color
:
rgba
(
102
,
102
,
102
,
1
);
}
}
</style>
```
:::
### API
### Prop
### Prop
s
| 字段 | 说明 | 类型 | 默认值 |
|-----------------|------------------------------------------|---------|---------|
...
...
@@ -276,7 +219,13 @@ app.use(Icon);
| is-animation | 是否有动画,和duration参数互斥 | Boolean |
`true`
|
| duration | 设置动画持续时间 | Number |
`1000`
|
### Event
### Event
s
| 名称 | 说明 | 回调参数 |
|-------|----------|-------------|
| click | 按钮点击时触发事件 | event: MouseEvent |
\ No newline at end of file
| click | 按钮点击时触发事件 | event: MouseEvent |
### Slots
| 名称 | 说明 |
|---------|--------------|
| default | 默认slot,用以自定义内容 |
\ No newline at end of file
src/packages/__VUE/backtop/doc.taro.md
浏览文件 @
a84791d6
...
...
@@ -197,7 +197,7 @@ export default {
### API
### Prop
### Prop
s
| 字段 | 说明 | 类型 | 默认值 |
|-----------------|------------------------------------------|---------|---------|
...
...
@@ -207,7 +207,14 @@ export default {
| distance | 页面垂直滚动多高后出现 | Number |
`200`
|
| z-index | 设置组件页面层级 | Number |
`10`
|
### Event
### Event
s
| 名称 | 说明 | 回调参数 |
|-------|----------|-------------|
| click | 按钮点击时触发事件 | event: MouseEvent |
\ No newline at end of file
| click | 按钮点击时触发事件 | event: MouseEvent |
### Slots
| 名称 | 说明 |
|---------|--------------|
| content | 滚动容器中包含的内容 |
| icon | 返回到顶部,按钮内容 |
\ No newline at end of file
src/packages/__VUE/backtop/index.vue
浏览文件 @
a84791d6
...
...
@@ -21,7 +21,7 @@ export default create({
default
:
10
},
elId
:
{
type
:
[
String
,
Element
],
type
:
[
String
],
default
:
'
body
'
},
...
...
src/packages/__VUE/badge/doc.en-US.md
浏览文件 @
a84791d6
...
...
@@ -210,7 +210,7 @@ app.use(Badge);
:::
### Prop
### Prop
s
| Attribute | Description | Type | Default |
|---------|--------------------------------------------|---------|-----------|
...
...
src/packages/__VUE/badge/doc.md
浏览文件 @
a84791d6
...
...
@@ -211,7 +211,7 @@ app.use(Badge);
:::
### Prop
### Prop
s
| 字段 | 说明 | 类型 | 默认值 |
|---------|--------------------------------------------|---------|-----------|
...
...
src/packages/__VUE/button/doc.en-US.md
浏览文件 @
a84791d6
...
...
@@ -189,7 +189,7 @@ The color of the button can be customized through the color property.
## API
### Prop
### Prop
s
| Attribute | Description | Type | Default |
| -------- | ------------------------------------------------------------ | ------- | --------- |
...
...
@@ -205,7 +205,7 @@ The color of the button can be customized through the color property.
| icon-class-prefix
`v3.1.17`
| Custom icon class name prefix for using custom icons | String |
`nut-icon`
|
| loading | Whether to show loading status | Boolean |
`false`
|
### Event
### Event
s
| Event | Description | Arguments |
| ------ | -------------- | ----------------- |
...
...
src/packages/__VUE/popover/demo.vue
浏览文件 @
a84791d6
<
template
>
<div
class=
"demo"
>
<h2>
{{
translate
(
'
title
1
'
)
}}
</h2>
<h2>
{{
translate
(
'
title
'
)
}}
</h2>
<nut-row
type=
"flex"
>
<nut-col
:span=
"8"
>
...
...
@@ -24,7 +24,7 @@
</nut-col>
</nut-row>
<h2>
{{ translate('title
2
') }}
</h2>
<h2>
{{ translate('title
1
') }}
</h2>
<nut-row
type=
"flex"
>
<nut-col
:span=
"8"
>
...
...
@@ -43,7 +43,7 @@
</nut-col>
</nut-row>
<h2>
{{ translate('title
3
') }}
</h2>
<h2>
{{ translate('title
2
') }}
</h2>
<nut-popover
v-model:visible=
"visible.Customized"
location=
"bottom-start"
>
<
template
#reference
>
<nut-button
type=
"primary"
shape=
"square"
>
{{
translate
(
'
content
'
)
}}
</nut-button>
...
...
@@ -59,7 +59,7 @@
</
template
>
</nut-popover>
<h2>
{{ translate('title
4
') }}
</h2>
<h2>
{{ translate('title
3
') }}
</h2>
<nut-row
type=
"flex"
justify=
"center"
>
<nut-col
:span=
"24"
style=
"text-align: center"
>
...
...
src/packages/__VUE/popover/doc.en-US.md
浏览文件 @
a84791d6
...
...
@@ -15,6 +15,8 @@ import { Popover, Popup } from '@nutui/nutui';
import
{
Popover
,
Popup
}
from
'
@nutui/nutui-taro
'
;
const
app
=
createApp
();
app
.
use
(
Popup
);
app
.
use
(
Popover
);
```
...
...
@@ -283,7 +285,7 @@ export default {
### Prop
### Prop
s
| Attribute | Description | Type | Default |
|----------------|---------------------------------|---------|------------|
...
...
src/packages/__VUE/popover/doc.md
浏览文件 @
a84791d6
...
...
@@ -15,6 +15,8 @@ import { Popover, Popup } from '@nutui/nutui';
import
{
Popover
,
Popup
}
from
'
@nutui/nutui-taro
'
;
const
app
=
createApp
();
app
.
use
(
Popup
);
app
.
use
(
Popover
);
```
...
...
@@ -283,7 +285,7 @@ export default {
### Prop
### Prop
s
| 字段 | 说明 | 类型 | 默认值 |
|----------------|---------------------------------|---------|------------|
...
...
src/packages/__VUE/tag/doc.en-US.md
浏览文件 @
a84791d6
...
...
@@ -134,7 +134,7 @@ export default {
### Prop
### Prop
s
| Attribute | Description | Type | Default |
|------------|--------------------------------------------------|---------|-----------|
...
...
@@ -153,7 +153,7 @@ export default {
|---------|--------------|
| default | Label display content |
### Event
### Event
s
| Event | Description | Arguments |
|----------|----------|----------|
...
...
src/packages/__VUE/tag/doc.md
浏览文件 @
a84791d6
...
...
@@ -136,7 +136,7 @@ export default {
### Prop
### Prop
s
| 字段 | 说明 | 类型 | 默认值 |
|------------|--------------------------------------------------|---------|-----------|
...
...
@@ -155,7 +155,7 @@ export default {
|---------|--------------|
| default | 标签显示内容 |
### Event
### Event
s
| 事件名称 | 说明 | 回调参数 |
|----------|----------|----------|
...
...
src/packages/__VUE/watermark/doc.en-US.md
浏览文件 @
a84791d6
...
...
@@ -113,13 +113,13 @@ app.use(Watermark);
| 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
W
idth | Width of image |
`number`
|
`120`
|
| image
H
eight | Height of image |
`number`
|
`64`
|
| z
I
ndex | Z-index of the appended watermark element |
`number`
|
`2000`
|
| image
-w
idth | Width of image |
`number`
|
`120`
|
| image
-h
eight | Height of image |
`number`
|
`64`
|
| z
-i
ndex | Z-index of the appended watermark element |
`number`
|
`2000`
|
| content | Watermark text content |
`string`
| - |
| font
C
olor | Watermark text color |
`string`
|
`rgba(0, 0, 0, .15)`
|
| font
S
ize | Watermark text font size |
`string \| number`
|
`16`
|
| gap
X
| Horizontal spacing between watermarks |
`number`
|
`24`
|
| gap
Y
| Vertical spacing between watermarks |
`number`
|
`48`
|
| full
P
age | Overwrite entire page |
`boolean`
|
`true`
|
| font
F
amily | Watermark text font family |
`boolean`
|
`true`
|
| font
-c
olor | Watermark text color |
`string`
|
`rgba(0, 0, 0, .15)`
|
| font
-s
ize | Watermark text font size |
`string \| number`
|
`16`
|
| gap
-x
| Horizontal spacing between watermarks |
`number`
|
`24`
|
| gap
-y
| Vertical spacing between watermarks |
`number`
|
`48`
|
| full
-p
age | Overwrite entire page |
`boolean`
|
`true`
|
| font
-f
amily | Watermark text font family |
`boolean`
|
`true`
|
src/packages/__VUE/watermark/doc.md
浏览文件 @
a84791d6
...
...
@@ -118,15 +118,15 @@ app.use(Watermark);
| height | 水印的高度 |
`number`
|
`64`
|
| rotate | 水印绘制时,旋转的角度 |
`number`
|
`-22`
|
| image | 图片源,建议导出 2 倍或 3 倍图,优先使用图片渲染水印 |
`string`
| - |
| image
W
idth | 图片宽度 |
`number`
|
`120`
|
| image
H
eight | 图片高度 |
`number`
|
`64`
|
| z
I
ndex | 追加的水印元素的 z-index |
`number`
|
`2000`
|
| image
-w
idth | 图片宽度 |
`number`
|
`120`
|
| image
-h
eight | 图片高度 |
`number`
|
`64`
|
| z
-i
ndex | 追加的水印元素的 z-index |
`number`
|
`2000`
|
| content | 水印文字内容 |
`string`
| - |
| font
C
olor | 水印文字颜色 |
`string`
|
`rgba(0, 0, 0, .15)`
|
| font
S
ize | 文字大小 |
`string \| number`
|
`16`
|
| gap
X
| 水印之间的水平间距 |
`number`
|
`24`
|
| gap
Y
| 水印之间的垂直间距 |
`number`
|
`48`
|
| full
P
age | 是否覆盖整个页面 |
`boolean`
|
`true`
|
| font
F
amily | 水印文字字体 |
`boolean`
|
`true`
|
| font
-c
olor | 水印文字颜色 |
`string`
|
`rgba(0, 0, 0, .15)`
|
| font
-s
ize | 文字大小 |
`string \| number`
|
`16`
|
| gap
-x
| 水印之间的水平间距 |
`number`
|
`24`
|
| gap
-y
| 水印之间的垂直间距 |
`number`
|
`48`
|
| full
-p
age | 是否覆盖整个页面 |
`boolean`
|
`true`
|
| font
-f
amily | 水印文字字体 |
`boolean`
|
`true`
|
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录