Skip to content

Commit eda864c

Browse files
richard1015richard1015
committed
Merge remote-tracking branch 'origin/v2'
2 parents b78df08 + 90a8c79 commit eda864c

File tree

25 files changed

+435
-249
lines changed

25 files changed

+435
-249
lines changed

‎CHANGELOG.md

Lines changed: 14 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,10 @@
1+
## 2.2.3
2+
3+
`2020-04-03`
4+
5+
- :sparkles: upd(Uploader)： 新增 beforeUpload 回调钩子函数、新增selfData自定义增加上传的数据 @linrufeng
6+
- :bug: fix(Stepper)：关于Tabbar的问题重复点击一个TAB的时候会报错 #231 @zhenyulei
7+
18
## 2.2.2
29

310
`2020-03-31`
@@ -13,13 +20,13 @@
1320
* :sparkles: upd(Toast)：优化内部代码，文档优化 @zy19940510
1421
* :sparkles: upd(Progress)：优化内部代码，文档优化 @layman666
1522
* :sparkles: upd(SearchBar、TextInput)：组件优化 @yangxiaolu1993
16-
* :bug: upd(Range)：绑定的值无法更新到组件 #227 @undo03
17-
* :bug: upd(Countdown)：修复异步计算属性无法更新组件 #228 @undo03
18-
* :bug: upd(LuckDraw)：抽奖组件图片链接修复 @Ymm0008
19-
* :bug: upd(Picker)优化自定义数据联动demo @irisSong
20-
* :bug: upd(Popup)：按需加载icon修复 @yangkaixuan
21-
* :bug: upd(TabSelect)：组件tabList数据改变内容不刷新问题修复 @dushoujun
22-
* :bug: upd(TabBar)：更新数据 重新渲染的功能 @zhenyulei
23+
* :bug: fix(Range)：绑定的值无法更新到组件 #227 @undo03
24+
* :bug: fix(Countdown)：修复异步计算属性无法更新组件 #228 @undo03
25+
* :bug: fix(LuckDraw)：抽奖组件图片链接修复 @Ymm0008
26+
* :bug: fix(Picker)优化自定义数据联动demo @irisSong
27+
* :bug: fix(Popup)：按需加载icon修复 @yangkaixuan
28+
* :bug: fix(TabSelect)：组件tabList数据改变内容不刷新问题修复 @dushoujun
29+
* :bug: fix(TabBar)：更新数据 重新渲染的功能 @zhenyulei
2330

2431
## 2.2.1
2532

‎README-zh_CN.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
# NutUI 2
22
![npm version](https://img.shields.io/npm/v/@nutui/nutui.svg) [![Build Status](https://api.travis-ci.org/jdf2e/nutui.svg?branch=master)](https://github.com/jdf2e/nutui/) [![Coverage Status](https://coveralls.io/repos/github/jdf2e/nutui/badge.svg?branch=master)](https://coveralls.io/github/jdf2e/nutui?branch=master) ![license](https://img.shields.io/npm/l/@nutui/nutui.svg)
33

4-
一套移动端轻量级Vue组件库
4+
一套移动端轻量级组件库
55

66
![NutUI](https://img11.360buyimg.com/uba/jfs/t1/11117/21/3608/18942/5c20ab52E35e5a500/02e3c1f89cd3dad1.png)
77

‎README.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
# NutUI 2
22
![npm version](https://img.shields.io/npm/v/@nutui/nutui.svg) [![Build Status](https://api.travis-ci.org/jdf2e/nutui.svg?branch=master)](https://github.com/jdf2e/nutui/) [![Coverage Status](https://coveralls.io/repos/github/jdf2e/nutui/badge.svg?branch=master)](https://coveralls.io/github/jdf2e/nutui?branch=master) ![license](https://img.shields.io/npm/l/@nutui/nutui.svg)
33

4-
A light mobile Toolkit based on Vue
4+
A light mobile Toolkit
55

66
![NutUI](https://img11.360buyimg.com/uba/jfs/t1/11117/21/3608/18942/5c20ab52E35e5a500/02e3c1f89cd3dad1.png)
77

‎docs/intro.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
# NutUI
22

3-
NutUI是一套京东风格的移动端Vue组件库，开发和服务于移动Web界面的企业级前中后台产品。
3+
NutUI是一套京东风格的移动端组件库，开发和服务于移动Web界面的企业级前中后台产品。
44

55
<div style="margin:30px 0;">
66
<img src="http://img14.360buyimg.com/uba/jfs/t1/8543/6/11560/22014/5c2c6136E8023ac0a/6abbd9de10999c48.png" width="150" alt="NutUI">

‎package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@nutui/nutui",
3-
"version": "2.2.2",
3+
"version": "2.2.3",
44
"description": "一套轻量级移动端Vue组件库",
55
"typings": "dist/types/index.d.ts",
66
"main": "dist/nutui.js",

‎src/packages/button/button.scss

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -109,6 +109,6 @@
109109

110110
// shape-圆角
111111
&.circle {
112-
border-radius: $btn-border-radius-large
112+
border-radius: $btn-border-radius-large;
113113
}
114114
}

‎src/packages/button/button.vue

Lines changed: 36 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -1,67 +1,76 @@
11
<template>
22
<button :class="clsStyle" :disabled="disabled" @click="clickHandler">
33
<nut-icon class="txt-icon" v-if="icon != ''" :type="icon" :color="this.color"></nut-icon>
4-
<span :style="{color:this.color}"><slot></slot></span>
4+
<span :style="{color:this.color}">
5+
<slot></slot>
6+
</span>
57
</button>
68
</template>
79
<script>
8-
import Icon from './../icon/icon.vue';
10+
import Icon from "./../icon/icon.vue";
911
export default {
10-
name:'nut-button',
12+
name: "nut-button",
1113
props: {
1214
type: {
1315
type: String,
14-
default: ''
16+
default: ""
1517
},
1618
shape: {
1719
type: String,
18-
default: ''
20+
default: ""
1921
},
2022
icon: {
2123
type: String,
22-
default: ''
24+
default: ""
2325
},
2426
disabled: {
25-
type: Boolean
27+
type: Boolean,
28+
default: false
2629
},
2730
block: {
28-
type: Boolean
31+
type: Boolean,
32+
default: false
2933
},
3034
small: {
31-
type: Boolean
35+
type: Boolean,
36+
default: false
3237
},
3338
label: {
34-
type: Boolean
39+
type: Boolean,
40+
default: false
3541
},
3642
color: {
3743
type: String,
38-
default: ''
44+
default: ""
3945
}
4046
},
4147
components: {
42-
'nut-icon': Icon
48+
"nut-icon": Icon
4349
},
4450
computed: {
4551
clsStyle() {
46-
let cls = 'nut-button ';
47-
cls += `${this.type} ${this.shape}`;
48-
cls += this.small ? ' small': '';
49-
cls += this.block ? ' block': '';
50-
cls += this.label ? ' label': '';
51-
if(!this.$slots.default) {
52-
if(this.small) {
53-
cls += ' no-txt-small';
54-
}else {
55-
cls += ' no-txt';
56-
}
57-
}
52+
let cls = `nut-button ${this.type} ${this.shape}
53+
${this.small ? " small" : ""}
54+
${this.block ? " block" : ""}
55+
${this.label ? " label" : ""}
56+
${
57+
!this.$slots.default
58+
? this.small
59+
? "no-txt-small"
60+
: "no-txt"
61+
: ""
62+
}`;
5863
return cls;
5964
}
6065
},
6166
methods: {
62-
clickHandler() {
63-
this.$emit('click');
67+
clickHandler(event) {
68+
// 如果是loading就阻止点击
69+
if (this.disabled) {
70+
return;
71+
}
72+
this.$emit("click", event);
6473
}
6574
}
66-
}
75+
};
6776
</script>

‎src/packages/button/demo.vue

Lines changed: 77 additions & 62 deletions
Original file line numberDiff line numberDiff line change
@@ -1,88 +1,103 @@
11
<template>
22
<div>
3-
<h4>常规按钮</h4>
4-
<div class="bg">
5-
<nut-button @click="clickHandler">去结算</nut-button>
6-
<nut-button disabled>去结算（disabled）</nut-button>
7-
<div class="gap"></div>
8-
<nut-button small>去结算</nut-button>
9-
<nut-button small disabled>去结算（disabled）</nut-button>
10-
</div>
3+
<h4>常规按钮</h4>
4+
<div class="bg">
5+
<nut-button @click="clickHandler" :disabled="disabled">去结算</nut-button>
6+
<nut-button disabled>去结算（disabled）</nut-button>
7+
</div>
8+
<h4>常规按钮-小</h4>
9+
<div>
10+
<nut-button small>去结算</nut-button>
11+
<nut-button small disabled>去结算（disabled）</nut-button>
12+
</div>
1113

12-
<h4>常规按钮组</h4>
13-
<nut-buttongroup>
14-
<nut-button type="light">重置</nut-button>
15-
<nut-button>确定</nut-button>
16-
</nut-buttongroup>
14+
<h4>常规按钮组</h4>
15+
<nut-buttongroup>
16+
<nut-button type="light">重置</nut-button>
17+
<nut-button>确定</nut-button>
18+
</nut-buttongroup>
1719

18-
<h4>通栏按钮</h4>
19-
<div>
20-
<nut-button block>登录</nut-button>
21-
<div class="gap"></div>
22-
<nut-button block shape="circle">登录</nut-button>
23-
</div>
20+
<h4>通栏按钮</h4>
21+
<div>
22+
<nut-button block>登录</nut-button>
23+
</div>
2424

25-
<h4>圆角按钮-常规Button</h4>
26-
<div class="white-bg">
27-
<nut-button type="red" shape="circle" small>确认收货</nut-button>
28-
<nut-button type="gray" shape="circle" small>查看物流</nut-button>
29-
<nut-button type="default" shape="circle" small>再次购买</nut-button>
30-
<nut-button type="light" shape="circle" small>降价通知</nut-button>
31-
</div>
25+
<h4>通栏按钮-圆角</h4>
26+
<div>
27+
<nut-button block shape="circle">登录</nut-button>
28+
</div>
3229

33-
<h4>圆角按钮-标签Button</h4>
34-
<div class="white-bg">
35-
<nut-button type="primary" shape="circle" small>京东快递</nut-button>
36-
<nut-button type="lightred" shape="circle" small>好评 6.6万</nut-button>
37-
<nut-button type="actived" shape="circle" icon="tick" small>全部 100万</nut-button>
38-
</div>
30+
<h4>圆角按钮-常规Button</h4>
31+
<div class="white-bg">
32+
<nut-button type="red" shape="circle" small>确认收货</nut-button>
33+
<nut-button type="gray" shape="circle" small>查看物流</nut-button>
34+
<nut-button type="default" shape="circle" small>再次购买</nut-button>
35+
<nut-button type="light" shape="circle" small>降价通知</nut-button>
36+
</div>
3937

40-
<h4>图标按钮-小</h4>
41-
<div class="white-bg">
42-
<nut-button type="actived" shape="circle" icon="tick" small></nut-button>
43-
</div>
38+
<h4>圆角按钮-标签Button</h4>
39+
<div class="white-bg">
40+
<nut-button type="primary" shape="circle" small>京东快递</nut-button>
41+
<nut-button type="lightred" shape="circle" small>好评 6.6万</nut-button>
42+
<nut-button type="actived" shape="circle" icon="tick" small>全部 100万</nut-button>
43+
</div>
4444

45-
<h4>图标按钮-大</h4>
46-
<div class="white-bg">
47-
<nut-button type="actived" shape="circle" icon="tick"></nut-button>
48-
</div>
45+
<h4>图标按钮-小</h4>
46+
<div class="white-bg">
47+
<nut-button type="actived" shape="circle" icon="tick" small></nut-button>
48+
</div>
4949

50-
<h4>圆角按钮-商品属性选择Button</h4>
51-
<div class="white-bg">
52-
<nut-button type="actived" shape="circle" small>象牙白</nut-button>
53-
<nut-button type="light" shape="circle" small>皓月灰</nut-button>
54-
<nut-button type="dashed" shape="circle" small>晶钻蓝</nut-button>
55-
</div>
50+
<h4>图标按钮-大</h4>
51+
<div class="white-bg">
52+
<nut-button type="actived" shape="circle" icon="tick"></nut-button>
53+
</div>
5654

57-
<h4>自定义颜色</h4>
58-
<div class="white-bg">
59-
<nut-button type="actived" shape="circle" small color="#fff">象牙白</nut-button>
60-
<nut-button type="primary" shape="circle" small color="rgb(0,0,0)">象牙白</nut-button>
61-
<nut-button type="actived" shape="circle" icon="tick" color="rgb(0,0,0)" small></nut-button>
62-
<nut-button type="actived" shape="circle" icon="tick" color="rgb(0,0,0)" small>全部 100万</nut-button>
63-
</div>
55+
<h4>圆角按钮-商品属性选择Button</h4>
56+
<div class="white-bg">
57+
<nut-button type="actived" shape="circle" small>象牙白</nut-button>
58+
<nut-button type="light" shape="circle" small>皓月灰</nut-button>
59+
<nut-button type="dashed" shape="circle" small>晶钻蓝</nut-button>
60+
</div>
61+
62+
<h4>自定义颜色</h4>
63+
<div class="white-bg">
64+
<nut-button type="actived" shape="circle" small color="#fff">象牙白</nut-button>
65+
<nut-button type="primary" shape="circle" small color="rgb(0,0,0)">象牙白</nut-button>
66+
<nut-button type="actived" shape="circle" icon="tick" color="rgb(0,0,0)" small></nut-button>
67+
<nut-button type="actived" shape="circle" icon="tick" color="rgb(0,0,0)" small>全部 100万</nut-button>
68+
</div>
6469
</div>
6570
</template>
6671

6772
<script>
6873
export default {
69-
methods: {
70-
clickHandler() {
71-
alert('我点击了按钮');
72-
}
73-
}
74+
data() {
75+
return {
76+
disabled: false
77+
};
78+
},
79+
methods: {
80+
clickHandler(e) {
81+
// alert("我点击了按钮");
82+
console.log(e, "我点击了按钮");
83+
this.disabled = true;
84+
setTimeout(() => {
85+
this.disabled = false;
86+
}, 2000);
87+
}
88+
}
7489
};
7590
</script>
7691

7792
<style lang="scss" scoped>
7893
.bg {
79-
margin: 0 10px;
94+
margin: 0 10px;
8095
}
8196
.gap {
82-
height: 10px;
97+
height: 10px;
8398
}
8499
.white-bg {
85-
padding: 10px;
86-
background: #fff;
100+
padding: 10px;
101+
background: #fff;
87102
}
88103
</style>

0 commit comments

Comments
 (0)