mirror of
https://gitee.com/vant-contrib/vant.git
synced 2025-04-06 03:57:59 +08:00
[breaking change] GoodsAction: remove primary prop, add type prop
This commit is contained in:
parent
138790b3e3
commit
e417ad0e8b
@ -23,8 +23,11 @@
|
||||
|
||||
### GoodsAction
|
||||
|
||||
- [ ] GoodsActionBigBtn 重命名为 GoodsActionButton
|
||||
- [ ] GoodsActionMiniBtn 重命名为 GoodsActionIcon
|
||||
- [x] GoodsActionBigBtn 重命名为 GoodsActionButton
|
||||
- [x] GoodsActionMiniBtn 重命名为 GoodsActionIcon
|
||||
- [x] GoodsActionBigBtn 移除 primary 属性,新增 type 属性
|
||||
|
||||
改动原因:规范命名,统一用法
|
||||
|
||||
### Step
|
||||
|
||||
|
@ -1,5 +1,5 @@
|
||||
import { use } from '../utils';
|
||||
import Button, { ButtonEvents } from '../button';
|
||||
import Button, { ButtonType, ButtonEvents } from '../button';
|
||||
import { emit, inherit } from '../utils/functional';
|
||||
import { functionalRoute, routeProps, RouteProps } from '../utils/router';
|
||||
|
||||
@ -9,6 +9,7 @@ import { DefaultSlots } from '../utils/use/sfc';
|
||||
|
||||
export type GoodsActionButtonProps = RouteProps & {
|
||||
text?: string;
|
||||
type?: ButtonType;
|
||||
primary?: boolean;
|
||||
loading?: boolean;
|
||||
disabled?: boolean;
|
||||
@ -32,9 +33,9 @@ function GoodsActionButton(
|
||||
square
|
||||
class={bem()}
|
||||
size="large"
|
||||
type={props.type}
|
||||
loading={props.loading}
|
||||
disabled={props.disabled}
|
||||
type={props.primary ? 'danger' : 'warning'}
|
||||
onClick={onClick}
|
||||
{...inherit(ctx)}
|
||||
>
|
||||
@ -45,8 +46,8 @@ function GoodsActionButton(
|
||||
|
||||
GoodsActionButton.props = {
|
||||
...routeProps,
|
||||
type: String,
|
||||
text: String,
|
||||
primary: Boolean,
|
||||
loading: Boolean,
|
||||
disabled: Boolean
|
||||
};
|
||||
|
@ -13,11 +13,12 @@
|
||||
@click="onClickIcon"
|
||||
/>
|
||||
<van-goods-action-button
|
||||
type="warning"
|
||||
:text="$t('button1')"
|
||||
@click="onClickButton"
|
||||
/>
|
||||
<van-goods-action-button
|
||||
primary
|
||||
type="danger"
|
||||
:text="$t('button2')"
|
||||
@click="onClickButton"
|
||||
/>
|
||||
@ -43,11 +44,12 @@
|
||||
@click="onClickIcon"
|
||||
/>
|
||||
<van-goods-action-button
|
||||
type="warning"
|
||||
:text="$t('button1')"
|
||||
@click="onClickButton"
|
||||
/>
|
||||
<van-goods-action-button
|
||||
primary
|
||||
type="danger"
|
||||
:text="$t('button2')"
|
||||
@click="onClickButton"
|
||||
/>
|
||||
|
@ -30,11 +30,12 @@ Vue
|
||||
@click="onClickIcon"
|
||||
/>
|
||||
<van-goods-action-button
|
||||
type="warning"
|
||||
text="Button1"
|
||||
@click="onClickButton"
|
||||
/>
|
||||
<van-goods-action-button
|
||||
primary
|
||||
type="danger"
|
||||
text="Button2"
|
||||
@click="onClickButton"
|
||||
/>
|
||||
@ -73,9 +74,12 @@ Use `info` prop to show messages in upper right corner of icon
|
||||
icon="shop-o"
|
||||
text="Icon3"
|
||||
/>
|
||||
<van-goods-action-button text="Button1" />
|
||||
<van-goods-action-button
|
||||
primary
|
||||
type="warning"
|
||||
text="Button1"
|
||||
/>
|
||||
<van-goods-action-button
|
||||
type="danger"
|
||||
text="Button2"
|
||||
/>
|
||||
</van-goods-action>
|
||||
@ -104,6 +108,7 @@ Use `info` prop to show messages in upper right corner of icon
|
||||
|
||||
| Attribute | Description | Type | Default |
|
||||
|------|------|------|------|
|
||||
| type | Button type, Can be set to `primary` `info` `warning` `danger` | `String` | `default` |
|
||||
| text | Button text | `String` | - |
|
||||
| primary | Is primary button (red color) | `Boolean` | `false` |
|
||||
| disabled | Whether to disable button | `Boolean` | `false` |
|
||||
|
@ -1,6 +1,6 @@
|
||||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`Button render default slot 1`] = `<button class="van-button van-button--warning van-button--large van-button--square van-goods-action-button"><span class="van-button__text">Default Content</span></button>`;
|
||||
exports[`Button render default slot 1`] = `<button class="van-button van-button--default van-button--large van-button--square van-goods-action-button"><span class="van-button__text">Default Content</span></button>`;
|
||||
|
||||
exports[`Icon render default slot 1`] = `
|
||||
<div class="van-goods-action-icon van-hairline">
|
||||
|
@ -30,11 +30,12 @@ Vue
|
||||
@click="onClickIcon"
|
||||
/>
|
||||
<van-goods-action-button
|
||||
type="warning"
|
||||
text="加入购物车"
|
||||
@click="onClickButton"
|
||||
/>
|
||||
<van-goods-action-button
|
||||
primary
|
||||
type="danger"
|
||||
text="立即购买"
|
||||
@click="onClickButton"
|
||||
/>
|
||||
@ -72,9 +73,12 @@ export default {
|
||||
icon="shop-o"
|
||||
text="店铺"
|
||||
/>
|
||||
<van-goods-action-button text="加入购物车" />
|
||||
<van-goods-action-button
|
||||
primary
|
||||
type="warning"
|
||||
text="加入购物车"
|
||||
/>
|
||||
<van-goods-action-button
|
||||
type="danger"
|
||||
text="立即购买"
|
||||
/>
|
||||
</van-goods-action>
|
||||
@ -105,7 +109,7 @@ export default {
|
||||
| 参数 | 说明 | 类型 | 默认值 | 版本 |
|
||||
|------|------|------|------|------|
|
||||
| text | 按钮文字 | `String` | - | - |
|
||||
| primary | 是否为红色按钮 | `Boolean` | `false` | - |
|
||||
| type | 按钮类型,可选值为 `primary` `info` `warning` `danger` | `String` | `default` |
|
||||
| disabled | 是否禁用按钮 | `Boolean` | `false` | - | 1.3.10 |
|
||||
| loading | 是否显示为加载状态 | `Boolean` | `false` | - | 1.3.10 |
|
||||
| url | 跳转链接 | `String` | - | - |
|
||||
|
Loading…
x
Reference in New Issue
Block a user