blackteay/vant
1
0
Fork 0
mirror of https://gitee.com/vant-contrib/vant.git synced 2025-04-06 03:57:59 +08:00
Code Issues Projects Releases Wiki Activity

breaking change(Button): add success type, remove info type

Browse Source
This commit is contained in:
chenjiahan 2020-08-21 10:09:21 +08:00
parent 82b585fc2b
commit 07d1a2590f
19 changed files with 54 additions and 52 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
docs/markdown/migrate-from-v2.zh-CN.md
View File

@ -93,6 +93,8 @@ GoodsAction 商品导航组件重命名为 **ActionBar 行动栏**。
### API 调整
- Area: 移除 change 事件的第一个参数（picker 实例）
- Button: 蓝色按钮对应的类型由 `info` 调整为 `primary`
- Button: 绿色按钮对应的类型由 `primary` 调整为 `success`
- Picker: 移除 change 事件的第一个参数（picker 实例）
- Picker: 默认开启 show-toolbar 属性
- Picker: 级联选择下，confirm/change 事件返回的回调参数将包含为完整的选项对象。

16
src/button/README.md
View File

@ -16,7 +16,7 @@ app.use(Button);
```html
<van-button type="primary">Primary</van-button>
<van-button type="info">Info</van-button>
<van-button type="success">Success</van-button>
<van-button type="default">Default</van-button>
<van-button type="danger">Danger</van-button>
<van-button type="warning">Warning</van-button>
@ -26,21 +26,21 @@ app.use(Button);
```html
<van-button plain type="primary">Primary</van-button>
<van-button plain type="info">Danger</van-button>
<van-button plain type="primary">Danger</van-button>
```
### Hairline
```html
<van-button plain hairline type="primary">Hairline</van-button>
<van-button plain hairline type="info">Hairline</van-button>
<van-button plain hairline type="primary">Hairline</van-button>
```
### Disabled
```html
<van-button disabled type="primary">Diabled</van-button>
<van-button disabled type="info">Diabled</van-button>
<van-button disabled type="primary">Diabled</van-button>
```
### Loading
@ -48,14 +48,14 @@ app.use(Button);
```html
<van-button loading type="primary" />
<van-button loading type="primary" loading-type="spinner" />
<van-button loading type="info" loading-text="Loading..." />
<van-button loading type="primary" loading-text="Loading..." />
```
### Shape
```html
<van-button square type="primary">Square</van-button>
<van-button round type="info">Round</van-button>
<van-button round type="primary">Round</van-button>
```
### Icon
@ -63,7 +63,7 @@ app.use(Button);
```html
<van-button icon="plus" type="primary" />
<van-button icon="plus" type="primary">Button</van-button>
<van-button icon="https://img.yzcdn.cn/vant/user-active.png" type="info">
<van-button icon="https://img.yzcdn.cn/vant/user-active.png" type="primary">
Button
</van-button>
```
@ -106,7 +106,7 @@ app.use(Button);
| Attribute | Description | Type | Default |
| --- | --- | --- | --- |
| type | Can be set to `primary` `info` `warning` `danger` | _string_ | `default` |
| type | Can be set to `primary` `success` `warning` `danger` | _string_ | `default` |
| size | Can be set to `large` `small` `mini` | _string_ | `normal` |
| text | Text | _string_ | - |
| color `v2.1.8` | Color, support linear-gradient | _string_ | - |

18
src/button/README.zh-CN.md
View File

@ -14,11 +14,11 @@ app.use(Button);
### 按钮类型
按钮支持 `default`、`primary`、`info`、`warning`、`danger` 五种类型，默认为 `default`。
按钮支持 `default`、`primary`、`success`、`warning`、`danger` 五种类型，默认为 `default`。
```html
<van-button type="primary">主要按钮</van-button>
<van-button type="info">信息按钮</van-button>
<van-button type="success">成功按钮</van-button>
<van-button type="default">默认按钮</van-button>
<van-button type="warning">警告按钮</van-button>
<van-button type="danger">危险按钮</van-button>
@ -30,7 +30,7 @@ app.use(Button);
```html
<van-button plain type="primary">朴素按钮</van-button>
<van-button plain type="info">朴素按钮</van-button>
<van-button plain type="primary">朴素按钮</van-button>
```
### 细边框
@ -39,7 +39,7 @@ app.use(Button);
```html
<van-button plain hairline type="primary">细边框按钮</van-button>
<van-button plain hairline type="info">细边框按钮</van-button>
<van-button plain hairline type="primary">细边框按钮</van-button>
```
### 禁用状态
@ -48,7 +48,7 @@ app.use(Button);
```html
<van-button disabled type="primary">禁用状态</van-button>
<van-button disabled type="info">禁用状态</van-button>
<van-button disabled type="primary">禁用状态</van-button>
```
### 加载状态
@ -58,7 +58,7 @@ app.use(Button);
```html
<van-button loading type="primary" />
<van-button loading type="primary" loading-type="spinner" />
<van-button loading type="info" loading-text="加载中..." />
<van-button loading type="primary" loading-text="加载中..." />
```
### 按钮形状
@ -67,7 +67,7 @@ app.use(Button);
```html
<van-button square type="primary">方形按钮</van-button>
<van-button round type="info">圆形按钮</van-button>
<van-button round type="primary">圆形按钮</van-button>
```
### 图标按钮
@ -77,7 +77,7 @@ app.use(Button);
```html
<van-button icon="plus" type="primary" />
<van-button icon="plus" type="primary">按钮</van-button>
<van-button icon="https://img.yzcdn.cn/vant/user-active.png" type="info">
<van-button icon="https://img.yzcdn.cn/vant/user-active.png" type="primary">
按钮
</van-button>
```
@ -128,7 +128,7 @@ app.use(Button);
| 参数 | 说明 | 类型 | 默认值 |
| --- | --- | --- | --- |
| type | 类型，可选值为 `primary` `info` `warning` `danger` | _string_ | `default` |
| type | 类型，可选值为 `primary` `success` `warning` `danger` | _string_ | `default` |
| size | 尺寸，可选值为 `large` `small` `mini` | _string_ | `normal` |
| text | 按钮文字 | _string_ | - |
| color `v2.1.8` | 按钮颜色，支持传入`linear-gradient`渐变色 | _string_ | - |

18
src/button/demo/index.vue
View File

@ -3,7 +3,7 @@
<demo-block :title="t('type')">
<div class="demo-button-row">
<van-button type="primary">{{ t('primary') }}</van-button>
<van-button type="info">{{ t('info') }}</van-button>
<van-button type="success">{{ t('success') }}</van-button>
<van-button type="default">{{ t('default') }}</van-button>
</div>
<van-button type="danger">{{ t('danger') }}</van-button>
@ -12,28 +12,28 @@
<demo-block :title="t('plain')">
<van-button plain type="primary" :text="t('plain')" />
<van-button plain type="info" :text="t('plain')" />
<van-button plain type="success" :text="t('plain')" />
</demo-block>
<demo-block :title="t('hairline')">
<van-button plain hairline type="primary" :text="t('hairlineButton')" />
<van-button plain hairline type="info" :text="t('hairlineButton')" />
<van-button plain hairline type="success" :text="t('hairlineButton')" />
</demo-block>
<demo-block :title="t('disabled')">
<van-button disabled type="primary" :text="t('disabled')" />
<van-button disabled type="info" :text="t('disabled')" />
<van-button disabled type="success" :text="t('disabled')" />
</demo-block>
<demo-block :title="t('loadingStatus')">
<van-button loading type="primary" />
<van-button loading type="primary" loading-type="spinner" />
<van-button loading :loading-text="t('loadingText')" type="info" />
<van-button loading :loading-text="t('loadingText')" type="success" />
</demo-block>
<demo-block :title="t('shape')">
<van-button type="primary" square :text="t('square')" />
<van-button type="info" round :text="t('round')" />
<van-button type="success" round :text="t('round')" />
</demo-block>
<demo-block :title="t('icon')">
@ -41,7 +41,7 @@
<van-button type="primary" icon="plus" :text="t('button')" />
<van-button
plain
type="info"
type="primary"
icon="https://img.yzcdn.cn/vant/user-active.png"
:text="t('button')"
/>
@ -89,7 +89,7 @@ export default {
shape: '按钮形状',
default: '默认按钮',
primary: '主要按钮',
info: '信息按钮',
success: '成功按钮',
danger: '危险按钮',
warning: '警告按钮',
large: '大号按钮',
@ -118,7 +118,7 @@ export default {
shape: 'Shape',
default: 'Default',
primary: 'Primary',
info: 'Info',
success: 'Success',
danger: 'Danger',
warning: 'Warning',
large: 'Large',

12
src/button/index.less
View File

@ -53,10 +53,10 @@
border: @button-border-width solid @button-primary-border-color;
}
&--info {
color: @button-info-color;
background-color: @button-info-background-color;
border: @button-border-width solid @button-info-border-color;
&--success {
color: @button-success-color;
background-color: @button-success-background-color;
border: @button-border-width solid @button-success-border-color;
}
&--danger {
@ -78,8 +78,8 @@
color: @button-primary-background-color;
}
&.van-button--info {
color: @button-info-background-color;
&.van-button--success {
color: @button-success-background-color;
}
&.van-button--danger {

2
src/checkbox/README.md
View File

@ -150,7 +150,7 @@ export default {
</van-checkbox-group>
<van-button type="primary" @click="checkAll">Check All</van-button>
<van-button type="info" @click="toggleAll">Toggle All</van-button>
<van-button type="primary" @click="toggleAll">Toggle All</van-button>
```
```js

2
src/checkbox/README.zh-CN.md
View File

@ -168,7 +168,7 @@ export default {
</van-checkbox-group>
<van-button type="primary" @click="checkAll">全选</van-button>
<van-button type="info" @click="toggleAll">反选</van-button>
<van-button type="primary" @click="toggleAll">反选</van-button>
```
```js

2
src/checkbox/demo/index.vue
View File

@ -79,7 +79,7 @@
<van-button type="primary" @click="checkAll">
{{ t('checkAll') }}
</van-button>
<van-button type="info" @click="toggleAll">
<van-button type="primary" @click="toggleAll">
{{ t('inverse') }}
</van-button>
</div>

4
src/form/README.md
View File

@ -32,7 +32,7 @@ app.use(Form);
:rules="[{ required: true, message: 'Password is required' }]"
/>
<div style="margin: 16px;">
<van-button round block type="info" native-type="submit">
<van-button round block type="primary" native-type="submit">
Submit
</van-button>
</div>
@ -78,7 +78,7 @@ export default {
:rules="[{ validator: asyncValidator, message: 'Error message' }]"
/>
<div style="margin: 16px;">
<van-button round block type="info" native-type="submit">
<van-button round block type="primary" native-type="submit">
Submit
</van-button>
</div>

4
src/form/README.zh-CN.md
View File

@ -38,7 +38,7 @@ app.use(Form);
:rules="[{ required: true, message: '请填写密码' }]"
/>
<div style="margin: 16px;">
<van-button round block type="info" native-type="submit">
<van-button round block type="primary" native-type="submit">
提交
</van-button>
</div>
@ -89,7 +89,7 @@ export default {
:rules="[{ validator: asyncValidator, message: '请输入正确内容' }]"
/>
<div style="margin: 16px;">
<van-button round block type="info" native-type="submit">
<van-button round block type="primary" native-type="submit">
提交
</van-button>
</div>

2
src/form/demo/BasicUsage.vue
View File

@ -17,7 +17,7 @@
:placeholder="t('password')"
/>
<div style="margin: 16px 16px 0;">
<van-button round block type="info" native-type="submit">
<van-button round block type="primary" native-type="submit">
{{ t('submit') }}
</van-button>
</div>

2
src/form/demo/FieldType.vue
View File

@ -65,7 +65,7 @@
<field-type-calendar />
<div style="margin: 16px 16px 0;">
<van-button round block type="info" native-type="submit">
<van-button round block type="primary" native-type="submit">
{{ t('submit') }}
</van-button>
</div>

2
src/form/demo/ValidateRules.vue
View File

@ -23,7 +23,7 @@
:placeholder="t('asyncValidator')"
/>
<div style="margin: 16px 16px 0;">
<van-button round block type="info" native-type="submit">
<van-button round block type="primary" native-type="submit">
{{ t('submit') }}
</van-button>
</div>

2
src/number-keyboard/README.md
View File

@ -84,7 +84,7 @@ Use `extra-key` prop to set the content of bottom left button
Use `title` prop to set keyboard title
```html
<van-cell plain type="info" @touchstart.stop="show = true">
<van-cell plain type="primary" @touchstart.stop="show = true">
Show Keyboard With Title
</van-cell>
<van-number-keyboard

2
src/number-keyboard/README.zh-CN.md
View File

@ -93,7 +93,7 @@ export default {
通过 `title` 属性可以设置键盘标题
```html
<van-cell plain type="info" @touchstart.stop="show = true">
<van-cell plain type="primary" @touchstart.stop="show = true">
弹出带标题的键盘
</van-cell>
<van-number-keyboard

2
src/sticky/README.md
View File

@ -24,7 +24,7 @@ app.use(Sticky);
```html
<van-sticky :offset-top="50">
<van-button type="info">Offset Top</van-button>
<van-button type="primary">Offset Top</van-button>
</van-sticky>
```

2
src/sticky/README.zh-CN.md
View File

@ -32,7 +32,7 @@ app.use(Sticky);
```html
<van-sticky :offset-top="50">
<van-button type="info">吸顶距离</van-button>
<van-button type="primary">吸顶距离</van-button>
</van-sticky>
```

2
src/sticky/demo/index.vue
View File

@ -10,7 +10,7 @@
<demo-block :title="t('offsetTop')">
<van-sticky :offset-top="50">
<van-button type="info" style="margin-left: 115px;">
<van-button type="primary" style="margin-left: 115px;">
{{ t('offsetTop') }}
</van-button>
</van-sticky>

10
src/style/var.less
View File

@ -139,11 +139,11 @@
@button-default-background-color: @white;
@button-default-border-color: @border-color;
@button-primary-color: @white;
@button-primary-background-color: @green;
@button-primary-border-color: @green;
@button-info-color: @white;
@button-info-background-color: @blue;
@button-info-border-color: @blue;
@button-primary-background-color: @blue;
@button-primary-border-color: @blue;
@button-success-color: @white;
@button-success-background-color: @green;
@button-success-border-color: @green;
@button-danger-color: @white;
@button-danger-background-color: @red;
@button-danger-border-color: @red;