Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
京东前端
nutui
提交
5bdbccb3
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 搜索 >>
提交
5bdbccb3
编写于
2月 01, 2021
作者:
Z
zy19940510
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
feat: 增加button图标功能
上级
fb1c789c
变更
3
隐藏空白更改
内联
并排
Showing
3 changed file
with
26 addition
and
6 deletion
+26
-6
src/packages/button/demo.vue
src/packages/button/demo.vue
+14
-3
src/packages/button/index.scss
src/packages/button/index.scss
+3
-0
src/packages/button/index.vue
src/packages/button/index.vue
+9
-3
未找到文件。
src/packages/button/demo.vue
浏览文件 @
5bdbccb3
...
...
@@ -30,12 +30,21 @@
<h2>
加载状态
</h2>
<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>
</div>
<h2>
按钮尺寸
</h2>
<div
class=
"demo-button-row2"
>
<
div
class=
"demo-button-row2"
>
<nut-button
size=
"large"
type=
"primary"
>
大号按钮
</nut-button>
</div
>
<
nut-button
size=
"large"
type=
"primary"
style=
"margin-bottom: 10px"
>
大号按钮
</nut-button
>
<nut-button
type=
"primary"
>
普通按钮
</nut-button>
<nut-button
size=
"small"
type=
"primary"
>
小型按钮
</nut-button>
</div>
...
...
@@ -68,9 +77,11 @@ export default createDemo({
<
style
lang=
"scss"
scoped
>
.demo-button-row
{
margin-bottom
:
20px
;
margin-left
:
15px
;
}
.demo-button-row2
{
margin-bottom
:
10px
;
margin-left
:
15px
;
}
.nut-button
{
margin-right
:
15px
;
...
...
src/packages/button/index.scss
浏览文件 @
5bdbccb3
...
...
@@ -13,6 +13,9 @@
-webkit-appearance
:
none
;
user-select
:
none
;
touch-action
:
manipulation
;
.text
{
margin-left
:
5px
;
}
&
::before
{
position
:
absolute
;
top
:
50%
;
...
...
src/packages/button/index.vue
浏览文件 @
5bdbccb3
<
template
>
<view
:class=
"classes"
:style=
"getStyle"
@
click=
"handleClick"
>
<!--
<i
class=
"nut-icon-loading"
v-if=
"loading"
></i>
-->
<!--
<i
:class=
"icon"
v-if=
"icon && !loading"
></i>
-->
<slot></slot>
<nut-icon
class=
"nut-icon-loading"
v-if=
"loading"
></nut-icon>
<nut-icon
:class=
"icon"
v-if=
"icon && !loading"
:name=
"icon"
></nut-icon>
<view
:class=
"
{ text: icon || loading }" v-if="$slots.default"
>
<slot></slot
></view>
</view>
</
template
>
...
...
@@ -51,6 +53,10 @@ export default create({
block
:
{
type
:
Boolean
,
default
:
false
},
icon
:
{
type
:
String
,
default
:
''
}
},
components
:
{},
...
...
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录