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