mirror of
https://gitee.com/vant-contrib/vant.git
synced 2026-06-04 01:28:19 +08:00
Compare commits
3 Commits
317035e9f5
...
f37fb01c4d
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
f37fb01c4d | ||
|
|
bcd4ddfbe4 | ||
|
|
f2eb7550a5 |
@ -172,7 +172,7 @@ export default {
|
||||
| Attribute | Description | Type | Default |
|
||||
| --- | --- | --- | --- |
|
||||
| v-model:show | Whether to show ActionSheet | _boolean_ | `false` |
|
||||
| actions | Options | _Action[]_ | `[]` |
|
||||
| actions | Options | _ActionSheetAction[]_ | `[]` |
|
||||
| title | Title | _string_ | - |
|
||||
| cancel-text | Text of cancel button | _string_ | - |
|
||||
| description | Description above the options | _string_ | - |
|
||||
@ -192,7 +192,7 @@ export default {
|
||||
| teleport | Specifies a target element where ActionSheet will be mounted | _string \| Element_ | - |
|
||||
| before-close `v3.1.4` | Callback function before close | _(action: string) => boolean \| Promise\<boolean\>_ | - |
|
||||
|
||||
### Data Structure of Action
|
||||
### Data Structure of ActionSheetAction
|
||||
|
||||
| Key | Description | Type |
|
||||
| --------- | ------------------------------- | --------------------------- |
|
||||
@ -202,13 +202,13 @@ export default {
|
||||
| className | className for the option | _string \| Array \| object_ |
|
||||
| loading | Whether to be loading status | _boolean_ |
|
||||
| disabled | Whether to be disabled | _boolean_ |
|
||||
| callback | Callback function after clicked | _action: Action_ |
|
||||
| callback | Callback function after clicked | _action: ActionSheetAction_ |
|
||||
|
||||
### Events
|
||||
|
||||
| Event | Description | Arguments |
|
||||
| --- | --- | --- |
|
||||
| select | Emitted when an option is clicked | _action: Action, index: number_ |
|
||||
| select | Emitted when an option is clicked | _action: ActionSheetAction, index: number_ |
|
||||
| cancel | Emitted when the cancel button is clicked | - |
|
||||
| open | Emitted when opening ActionSheet | - |
|
||||
| close | Emitted when closing ActionSheet | - |
|
||||
@ -224,6 +224,14 @@ export default {
|
||||
| description | Custom description above the options |
|
||||
| cancel `v3.0.10` | Custom the content of cancel button |
|
||||
|
||||
### Types
|
||||
|
||||
The component exports the following type definitions:
|
||||
|
||||
```ts
|
||||
import type { ActionSheetAction } from 'vant';
|
||||
```
|
||||
|
||||
## Theming
|
||||
|
||||
### CSS Variables
|
||||
|
||||
@ -182,7 +182,7 @@ export default {
|
||||
| 参数 | 说明 | 类型 | 默认值 |
|
||||
| --- | --- | --- | --- |
|
||||
| v-model:show | 是否显示动作面板 | _boolean_ | `false` |
|
||||
| actions | 面板选项列表 | _Action[]_ | `[]` |
|
||||
| actions | 面板选项列表 | _ActionSheetAction[]_ | `[]` |
|
||||
| title | 顶部标题 | _string_ | - |
|
||||
| cancel-text | 取消按钮文字 | _string_ | - |
|
||||
| description | 选项上方的描述信息 | _string_ | - |
|
||||
@ -214,13 +214,13 @@ export default {
|
||||
| className | 为对应列添加额外的 class | _string \| Array \| object_ |
|
||||
| loading | 是否为加载状态 | _boolean_ |
|
||||
| disabled | 是否为禁用状态 | _boolean_ |
|
||||
| callback | 点击时触发的回调函数 | _action: Action_ |
|
||||
| callback | 点击时触发的回调函数 | _action: ActionSheetAction_ |
|
||||
|
||||
### Events
|
||||
|
||||
| 事件名 | 说明 | 回调参数 |
|
||||
| --- | --- | --- |
|
||||
| select | 点击选项时触发,禁用或加载状态下不会触发 | _action: Action, index: number_ |
|
||||
| select | 点击选项时触发,禁用或加载状态下不会触发 | _action: ActionSheetAction, index: number_ |
|
||||
| cancel | 点击取消按钮时触发 | - |
|
||||
| open | 打开面板时触发 | - |
|
||||
| close | 关闭面板时触发 | - |
|
||||
@ -236,6 +236,14 @@ export default {
|
||||
| description | 自定义描述文案 |
|
||||
| cancel `v3.0.10` | 自定义取消按钮内容 |
|
||||
|
||||
### 类型定义
|
||||
|
||||
组件导出以下类型定义:
|
||||
|
||||
```ts
|
||||
import type { ActionSheetAction } from 'vant';
|
||||
```
|
||||
|
||||
## 主题定制
|
||||
|
||||
### 样式变量
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
import { PropType, ref, defineComponent } from 'vue';
|
||||
|
||||
// Utils
|
||||
import { isAndroid, createNamespace } from '../utils';
|
||||
import { createNamespace } from '../utils';
|
||||
|
||||
// Components
|
||||
import { Cell } from '../cell';
|
||||
@ -12,7 +12,6 @@ import type { AddressEditSearchItem } from './types';
|
||||
import type { FieldInstance } from '../field/types';
|
||||
|
||||
const [name, bem, t] = createNamespace('address-edit-detail');
|
||||
const android = isAndroid();
|
||||
|
||||
export default defineComponent({
|
||||
name,
|
||||
@ -41,18 +40,6 @@ export default defineComponent({
|
||||
emit('input', `${express.address || ''} ${express.name || ''}`.trim());
|
||||
};
|
||||
|
||||
const onFinish = () => field.value?.blur();
|
||||
|
||||
const renderFinish = () => {
|
||||
if (props.value && props.focused && android) {
|
||||
return (
|
||||
<div class={bem('finish')} onClick={onFinish}>
|
||||
{t('complete')}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
};
|
||||
|
||||
const renderSearchTitle = (express: AddressEditSearchItem) => {
|
||||
if (express.name) {
|
||||
const text = express.name.replace(
|
||||
@ -95,15 +82,14 @@ export default defineComponent({
|
||||
return (
|
||||
<>
|
||||
<Field
|
||||
v-slots={{ icon: renderFinish }}
|
||||
autosize
|
||||
clearable
|
||||
ref={field}
|
||||
class={bem()}
|
||||
rows={props.detailRows}
|
||||
type="textarea"
|
||||
label={t('label')}
|
||||
border={!showSearchResult()}
|
||||
clearable={!android}
|
||||
maxlength={props.detailMaxlength}
|
||||
modelValue={props.value}
|
||||
placeholder={t('placeholder')}
|
||||
|
||||
@ -186,5 +186,3 @@ The component provides the following CSS variables, which can be used to customi
|
||||
| --van-address-edit-buttons-padding | _var(--van-padding-xl) var(--van-padding-base)_ | - |
|
||||
| --van-address-edit-button-margin-bottom | _var(--van-padding-sm)_ | - |
|
||||
| --van-address-edit-button-font-size | _var(--van-font-size-lg)_ | - |
|
||||
| --van-address-edit-detail-finish-color | _var(--van-primary-color)_ | - |
|
||||
| --van-address-edit-detail-finish-font-size | _var(--van-font-size-sm)_ | - |
|
||||
|
||||
@ -188,5 +188,3 @@ addressEditRef.value?.setAddressDetail('');
|
||||
| --van-address-edit-buttons-padding | _var(--van-padding-xl) var(--van-padding-base)_ | - |
|
||||
| --van-address-edit-button-margin-bottom | _var(--van-padding-sm)_ | - |
|
||||
| --van-address-edit-button-font-size | _var(--van-font-size-lg)_ | - |
|
||||
| --van-address-edit-detail-finish-color | _var(--van-primary-color)_ | - |
|
||||
| --van-address-edit-detail-finish-font-size | _var(--van-font-size-sm)_ | - |
|
||||
|
||||
@ -5,8 +5,6 @@
|
||||
--van-address-edit-buttons-padding: @address-edit-buttons-padding;
|
||||
--van-address-edit-button-margin-bottom: @address-edit-button-margin-bottom;
|
||||
--van-contact-edit-button-font-size: @address-edit-button-font-size;
|
||||
--van-address-edit-detail-finish-color: @address-edit-detail-finish-color;
|
||||
--van-address-edit-detail-finish-font-size: @address-edit-detail-finish-font-size;
|
||||
}
|
||||
|
||||
.van-address-edit {
|
||||
@ -44,10 +42,5 @@
|
||||
&__keyword {
|
||||
color: var(--van-danger-color);
|
||||
}
|
||||
|
||||
&__finish {
|
||||
color: var(--van-address-edit-detail-finish-color);
|
||||
font-size: var(--van-address-edit-detail-finish-font-size);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -4,5 +4,3 @@
|
||||
@address-edit-buttons-padding: var(--van-padding-xl) var(--van-padding-base);
|
||||
@address-edit-button-margin-bottom: var(--van-padding-sm);
|
||||
@address-edit-button-font-size: var(--van-font-size-lg);
|
||||
@address-edit-detail-finish-color: var(--van-primary-color);
|
||||
@address-edit-detail-finish-font-size: var(--van-font-size-sm);
|
||||
|
||||
@ -121,6 +121,14 @@ export default {
|
||||
| item-bottom | Custom content after list item | _item: Address_ |
|
||||
| tag `v3.0.9` | Custom tag of list item | _item: Address_ |
|
||||
|
||||
### Types
|
||||
|
||||
The component exports the following type definitions:
|
||||
|
||||
```ts
|
||||
import type { AddressListAddress } from 'vant';
|
||||
```
|
||||
|
||||
## Theming
|
||||
|
||||
### CSS Variables
|
||||
|
||||
@ -81,28 +81,28 @@ export default {
|
||||
|
||||
### Props
|
||||
|
||||
| 参数 | 说明 | 类型 | 默认值 |
|
||||
| ---------------- | ----------------- | ----------- | ---------- |
|
||||
| v-model | 当前选中地址的 id | _string_ | - |
|
||||
| list | 地址列表 | _Address[]_ | `[]` |
|
||||
| disabled-list | 不可配送地址列表 | _Address[]_ | `[]` |
|
||||
| disabled-text | 不可配送提示文案 | _string_ | - |
|
||||
| switchable | 是否允许切换地址 | _boolean_ | `true` |
|
||||
| add-button-text | 底部按钮文字 | _string_ | `新增地址` |
|
||||
| default-tag-text | 默认地址标签文字 | _string_ | - |
|
||||
| 参数 | 说明 | 类型 | 默认值 |
|
||||
| ---------------- | ----------------- | ---------------------- | ---------- |
|
||||
| v-model | 当前选中地址的 id | _string_ | - |
|
||||
| list | 地址列表 | _AddressListAddress[]_ | `[]` |
|
||||
| disabled-list | 不可配送地址列表 | _AddressListAddress[]_ | `[]` |
|
||||
| disabled-text | 不可配送提示文案 | _string_ | - |
|
||||
| switchable | 是否允许切换地址 | _boolean_ | `true` |
|
||||
| add-button-text | 底部按钮文字 | _string_ | `新增地址` |
|
||||
| default-tag-text | 默认地址标签文字 | _string_ | - |
|
||||
|
||||
### Events
|
||||
|
||||
| 事件名 | 说明 | 回调参数 |
|
||||
| --------------- | ------------------------ | ------------------------------ |
|
||||
| add | 点击新增按钮时触发 | - |
|
||||
| edit | 点击编辑按钮时触发 | _item: Address, index: number_ |
|
||||
| select | 切换选中的地址时触发 | _item: Address, index: number_ |
|
||||
| edit-disabled | 编辑不可配送的地址时触发 | _item: Address, index: number_ |
|
||||
| select-disabled | 选中不可配送的地址时触发 | _item: Address, index: number_ |
|
||||
| click-item | 点击任意地址时触发 | _item: Address, index: number_ |
|
||||
| 事件名 | 说明 | 回调参数 |
|
||||
| --- | --- | --- |
|
||||
| add | 点击新增按钮时触发 | - |
|
||||
| edit | 点击编辑按钮时触发 | _item: AddressListAddress, index: number_ |
|
||||
| select | 切换选中的地址时触发 | _item: AddressListAddress, index: number_ |
|
||||
| edit-disabled | 编辑不可配送的地址时触发 | _item: AddressListAddress, index: number_ |
|
||||
| select-disabled | 选中不可配送的地址时触发 | _item: AddressListAddress, index: number_ |
|
||||
| click-item | 点击任意地址时触发 | _item: AddressListAddress, index: number_ |
|
||||
|
||||
### Address 数据结构
|
||||
### AddressListAddress 数据结构
|
||||
|
||||
| 键名 | 说明 | 类型 |
|
||||
| --------- | ------------------ | ------------------ |
|
||||
@ -114,12 +114,20 @@ export default {
|
||||
|
||||
### Slots
|
||||
|
||||
| 名称 | 说明 | 参数 |
|
||||
| ------------ | -------------------- | --------------- |
|
||||
| default | 在列表下方插入内容 | - |
|
||||
| top | 在顶部插入内容 | - |
|
||||
| item-bottom | 在列表项底部插入内容 | _item: Address_ |
|
||||
| tag `v3.0.9` | 自定义列表项标签内容 | _item: Address_ |
|
||||
| 名称 | 说明 | 参数 |
|
||||
| ------------ | -------------------- | -------------------------- |
|
||||
| default | 在列表下方插入内容 | - |
|
||||
| top | 在顶部插入内容 | - |
|
||||
| item-bottom | 在列表项底部插入内容 | _item: AddressListAddress_ |
|
||||
| tag `v3.0.9` | 自定义列表项标签内容 | _item: AddressListAddress_ |
|
||||
|
||||
### 类型定义
|
||||
|
||||
组件导出以下类型定义:
|
||||
|
||||
```ts
|
||||
import type { AddressListAddress } from 'vant';
|
||||
```
|
||||
|
||||
## 主题定制
|
||||
|
||||
|
||||
@ -149,6 +149,14 @@ app.use(Button);
|
||||
| icon `v3.0.18` | Custom icon |
|
||||
| loading | Custom loading icon |
|
||||
|
||||
### Types
|
||||
|
||||
The component exports the following type definitions:
|
||||
|
||||
```ts
|
||||
import type { ButtonType, ButtonSize } from 'vant';
|
||||
```
|
||||
|
||||
## Theming
|
||||
|
||||
### CSS Variables
|
||||
|
||||
@ -172,6 +172,14 @@ app.use(Button);
|
||||
| icon `v3.0.18` | 自定义图标 |
|
||||
| loading | 自定义加载图标 |
|
||||
|
||||
### 类型定义
|
||||
|
||||
组件导出以下类型定义:
|
||||
|
||||
```ts
|
||||
import type { ButtonType, ButtonSize } from 'vant';
|
||||
```
|
||||
|
||||
## 主题定制
|
||||
|
||||
### 样式变量
|
||||
|
||||
@ -240,6 +240,14 @@ export default {
|
||||
| title | Custom title | - |
|
||||
| option `v3.1.4` | Custom option text | _{ option: Option, selected: boolean }_ |
|
||||
|
||||
### Types
|
||||
|
||||
The component exports the following type definitions:
|
||||
|
||||
```ts
|
||||
import type { CascaderOption, CascaderFieldNames } from 'vant';
|
||||
```
|
||||
|
||||
## Theming
|
||||
|
||||
### CSS Variables
|
||||
|
||||
@ -252,6 +252,14 @@ export default {
|
||||
| title | 自定义顶部标题 | - |
|
||||
| option `v3.1.4` | 自定义选项文字 | _{ option: Option, selected: boolean }_ |
|
||||
|
||||
### 类型定义
|
||||
|
||||
组件导出以下类型定义:
|
||||
|
||||
```ts
|
||||
import type { CascaderOption, CascaderFieldNames } from 'vant';
|
||||
```
|
||||
|
||||
## 主题定制
|
||||
|
||||
### 样式变量
|
||||
|
||||
@ -192,6 +192,14 @@ app.use(CellGroup);
|
||||
| right-icon | Custom right icon |
|
||||
| extra | Custom extra content on the right |
|
||||
|
||||
### Types
|
||||
|
||||
The component exports the following type definitions:
|
||||
|
||||
```ts
|
||||
import type { CellArrowDirection } from 'vant';
|
||||
```
|
||||
|
||||
## Theming
|
||||
|
||||
### CSS Variables
|
||||
|
||||
@ -197,6 +197,14 @@ app.use(CellGroup);
|
||||
| right-icon | 自定义右侧图标 |
|
||||
| extra | 自定义单元格最右侧的额外内容 |
|
||||
|
||||
### 类型定义
|
||||
|
||||
组件导出以下类型定义:
|
||||
|
||||
```ts
|
||||
import type { CellArrowDirection } from 'vant';
|
||||
```
|
||||
|
||||
## 主题定制
|
||||
|
||||
### 样式变量
|
||||
|
||||
@ -167,6 +167,14 @@ export default {
|
||||
| ------- | ------------------- |
|
||||
| default | custom text content |
|
||||
|
||||
### Types
|
||||
|
||||
The component exports the following type definitions:
|
||||
|
||||
```ts
|
||||
import type { CircleStartPosition } from 'vant';
|
||||
```
|
||||
|
||||
## Theming
|
||||
|
||||
### CSS Variables
|
||||
|
||||
@ -181,6 +181,14 @@ export default {
|
||||
| ------- | -------------- |
|
||||
| default | 自定义文字内容 |
|
||||
|
||||
### 类型定义
|
||||
|
||||
组件导出以下类型定义:
|
||||
|
||||
```ts
|
||||
import type { CircleStartPosition } from 'vant';
|
||||
```
|
||||
|
||||
## 主题定制
|
||||
|
||||
### 样式变量
|
||||
|
||||
@ -112,3 +112,11 @@ Set grid spacing using `gutter` attribute. The default value is 0.
|
||||
| Event | Description | Arguments |
|
||||
| ----- | ------------------------------- | ------------------- |
|
||||
| click | Emitted when the col is clicked | _event: MouseEvent_ |
|
||||
|
||||
### Types
|
||||
|
||||
The component exports the following type definitions:
|
||||
|
||||
```ts
|
||||
import type { RowAlign, RowJustify } from 'vant';
|
||||
```
|
||||
|
||||
@ -117,3 +117,11 @@ Layout 组件提供了 `24列栅格`,通过在 `Col` 上添加 `span` 属性
|
||||
| 事件名 | 说明 | 回调参数 |
|
||||
| ------ | ---------- | ------------------- |
|
||||
| click | 点击时触发 | _event: MouseEvent_ |
|
||||
|
||||
### 类型定义
|
||||
|
||||
组件导出以下类型定义:
|
||||
|
||||
```ts
|
||||
import type { RowAlign, RowJustify } from 'vant';
|
||||
```
|
||||
|
||||
@ -90,6 +90,14 @@ export default {
|
||||
| ----- | --------------------------------- | ------------------- |
|
||||
| click | Emitted when component is clicked | _event: MouseEvent_ |
|
||||
|
||||
### Types
|
||||
|
||||
The component exports the following type definitions:
|
||||
|
||||
```ts
|
||||
import type { ContactCardType } from 'vant';
|
||||
```
|
||||
|
||||
## Theming
|
||||
|
||||
### CSS Variables
|
||||
|
||||
@ -84,6 +84,14 @@ export default {
|
||||
| ------ | ---------- | ------------------- |
|
||||
| click | 点击时触发 | _event: MouseEvent_ |
|
||||
|
||||
### 类型定义
|
||||
|
||||
组件导出以下类型定义:
|
||||
|
||||
```ts
|
||||
import type { ContactCardType } from 'vant';
|
||||
```
|
||||
|
||||
## 主题定制
|
||||
|
||||
### 样式变量
|
||||
|
||||
@ -118,7 +118,7 @@ export default defineComponent({
|
||||
label={t('name')}
|
||||
rules={[{ required: true, message: t('nameEmpty') }]}
|
||||
maxlength="30"
|
||||
placeholder={t('nameEmpty')}
|
||||
placeholder={t('name')}
|
||||
/>
|
||||
<Field
|
||||
v-model={contact.tel}
|
||||
@ -128,7 +128,7 @@ export default defineComponent({
|
||||
rules={[
|
||||
{ validator: props.telValidator, message: t('telInvalid') },
|
||||
]}
|
||||
placeholder={t('telEmpty')}
|
||||
placeholder={t('tel')}
|
||||
/>
|
||||
</div>
|
||||
{renderSetDefault()}
|
||||
|
||||
@ -77,6 +77,14 @@ export default {
|
||||
| name | Name | _string_ |
|
||||
| tel | Phone | _string_ |
|
||||
|
||||
### Types
|
||||
|
||||
The component exports the following type definitions:
|
||||
|
||||
```ts
|
||||
import type { ContactEditInfo } from 'vant';
|
||||
```
|
||||
|
||||
## Theming
|
||||
|
||||
### CSS Variables
|
||||
|
||||
@ -77,6 +77,14 @@ export default {
|
||||
| name | 联系人姓名 | _string_ |
|
||||
| tel | 联系人手机号 | _number \| string_ |
|
||||
|
||||
### 类型定义
|
||||
|
||||
组件导出以下类型定义:
|
||||
|
||||
```ts
|
||||
import type { ContactEditInfo } from 'vant';
|
||||
```
|
||||
|
||||
## 主题定制
|
||||
|
||||
### 样式变量
|
||||
|
||||
@ -14,7 +14,7 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
<div class="van-field__body">
|
||||
<input type="text"
|
||||
class="van-field__control"
|
||||
placeholder="Please fill in the name"
|
||||
placeholder="Name"
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
@ -29,7 +29,7 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
<div class="van-field__body">
|
||||
<input type="tel"
|
||||
class="van-field__control"
|
||||
placeholder="Please fill in the tel"
|
||||
placeholder="Phone"
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -95,6 +95,14 @@ export default {
|
||||
| tel | Phone | _string_ |
|
||||
| isDefault | Is default contact | _boolean_ |
|
||||
|
||||
### Types
|
||||
|
||||
The component exports the following type definitions:
|
||||
|
||||
```ts
|
||||
import type { ContactListItem } from 'vant';
|
||||
```
|
||||
|
||||
## Theming
|
||||
|
||||
### CSS Variables
|
||||
|
||||
@ -95,6 +95,14 @@ export default {
|
||||
| tel | 联系人手机号 | _number \| string_ |
|
||||
| isDefault | 是否为默认联系人 | _boolean_ |
|
||||
|
||||
### 类型定义
|
||||
|
||||
组件导出以下类型定义:
|
||||
|
||||
```ts
|
||||
import type { ContactListItem } from 'vant';
|
||||
```
|
||||
|
||||
## 主题定制
|
||||
|
||||
### 样式变量
|
||||
|
||||
@ -214,6 +214,19 @@ export default {
|
||||
| title | Custom title |
|
||||
| footer `v3.0.10` | Custom footer |
|
||||
|
||||
### Types
|
||||
|
||||
The component exports the following type definitions:
|
||||
|
||||
```ts
|
||||
import type {
|
||||
DialogTheme,
|
||||
DialogMessage,
|
||||
DialogOptions,
|
||||
DialogMessageAlign,
|
||||
} from 'vant';
|
||||
```
|
||||
|
||||
## Theming
|
||||
|
||||
### CSS Variables
|
||||
|
||||
@ -249,6 +249,19 @@ export default {
|
||||
| title | 自定义标题 |
|
||||
| footer `v3.0.10` | 自定义底部按钮区域 |
|
||||
|
||||
### 类型定义
|
||||
|
||||
组件导出以下类型定义:
|
||||
|
||||
```ts
|
||||
import type {
|
||||
DialogTheme,
|
||||
DialogMessage,
|
||||
DialogOptions,
|
||||
DialogMessageAlign,
|
||||
} from 'vant';
|
||||
```
|
||||
|
||||
## 主题定制
|
||||
|
||||
### 样式变量
|
||||
|
||||
@ -69,6 +69,14 @@ app.use(Divider);
|
||||
| ------- | ----------- |
|
||||
| default | content |
|
||||
|
||||
### Types
|
||||
|
||||
The component exports the following type definitions:
|
||||
|
||||
```ts
|
||||
import type { DividerContentPosition } from 'vant';
|
||||
```
|
||||
|
||||
## Theming
|
||||
|
||||
### CSS Variables
|
||||
|
||||
@ -79,6 +79,14 @@ app.use(Divider);
|
||||
| ------- | ---- |
|
||||
| default | 内容 |
|
||||
|
||||
### 类型定义
|
||||
|
||||
组件导出以下类型定义:
|
||||
|
||||
```ts
|
||||
import type { DividerContentPosition } from 'vant';
|
||||
```
|
||||
|
||||
## 主题定制
|
||||
|
||||
### 样式变量
|
||||
|
||||
@ -142,6 +142,14 @@ app.use(GridItem);
|
||||
| icon | Custom icon |
|
||||
| text | Custom text |
|
||||
|
||||
### Types
|
||||
|
||||
The component exports the following type definitions:
|
||||
|
||||
```ts
|
||||
import type { GridDirection } from 'vant';
|
||||
```
|
||||
|
||||
## Theming
|
||||
|
||||
### CSS Variables
|
||||
|
||||
@ -158,6 +158,14 @@ app.use(GridItem);
|
||||
| icon | 自定义图标 |
|
||||
| text | 自定义文字 |
|
||||
|
||||
### 类型定义
|
||||
|
||||
组件导出以下类型定义:
|
||||
|
||||
```ts
|
||||
import type { GridDirection } from 'vant';
|
||||
```
|
||||
|
||||
## 主题定制
|
||||
|
||||
### 样式变量
|
||||
|
||||
@ -114,6 +114,14 @@ app.use(Lazyload);
|
||||
| loading | Custom loading placeholder |
|
||||
| error | Custom error placeholder |
|
||||
|
||||
### Types
|
||||
|
||||
The component exports the following type definitions:
|
||||
|
||||
```ts
|
||||
import type { ImageFit } from 'vant';
|
||||
```
|
||||
|
||||
## Theming
|
||||
|
||||
### CSS Variables
|
||||
|
||||
@ -142,6 +142,14 @@ app.use(Lazyload);
|
||||
| loading | 自定义加载中的提示内容 |
|
||||
| error | 自定义加载失败时的提示内容 |
|
||||
|
||||
### 类型定义
|
||||
|
||||
组件导出以下类型定义:
|
||||
|
||||
```ts
|
||||
import type { ImageFit } from 'vant';
|
||||
```
|
||||
|
||||
## 主题定制
|
||||
|
||||
### 样式变量
|
||||
|
||||
@ -85,6 +85,14 @@ use `color` or `text-color` to change text color.
|
||||
| ------- | ------------ |
|
||||
| default | Loading text |
|
||||
|
||||
### Types
|
||||
|
||||
The component exports the following type definitions:
|
||||
|
||||
```ts
|
||||
import type { LoadingType } from 'vant';
|
||||
```
|
||||
|
||||
## Theming
|
||||
|
||||
### CSS Variables
|
||||
|
||||
@ -95,6 +95,14 @@ app.use(Loading);
|
||||
| ------- | -------- |
|
||||
| default | 加载文案 |
|
||||
|
||||
### 类型定义
|
||||
|
||||
组件导出以下类型定义:
|
||||
|
||||
```ts
|
||||
import type { LoadingType } from 'vant';
|
||||
```
|
||||
|
||||
## 主题定制
|
||||
|
||||
### 样式变量
|
||||
|
||||
@ -5,9 +5,7 @@ export default {
|
||||
confirm: 'Bestätigen',
|
||||
cancel: 'Abbrechen',
|
||||
delete: 'Löschen',
|
||||
complete: 'Complete',
|
||||
loading: 'Laden...',
|
||||
telEmpty: 'Bitte füllen Sie das Telefon aus',
|
||||
nameEmpty: 'Bitte geben Sie den Name an',
|
||||
confirmDelete: 'Sind Sie sicher, dass Sie löschen möchten?',
|
||||
telInvalid: 'Ungültige Telefonnummer',
|
||||
|
||||
@ -5,9 +5,7 @@ export default {
|
||||
confirm: 'Bestätigen',
|
||||
cancel: 'Abbrechen',
|
||||
delete: 'Löschen',
|
||||
complete: 'Complete',
|
||||
loading: 'Laden...',
|
||||
telEmpty: 'Bitte das Telefon ausfüllen',
|
||||
nameEmpty: 'Bitte den Name angeben',
|
||||
confirmDelete: 'Bist du sicher, dass du löschen möchtest?',
|
||||
telInvalid: 'Ungültige Telefonnummer',
|
||||
|
||||
@ -5,9 +5,7 @@ export default {
|
||||
confirm: 'Confirm',
|
||||
cancel: 'Cancel',
|
||||
delete: 'Delete',
|
||||
complete: 'Complete',
|
||||
loading: 'Loading...',
|
||||
telEmpty: 'Please fill in the tel',
|
||||
nameEmpty: 'Please fill in the name',
|
||||
confirmDelete: 'Are you sure you want to delete?',
|
||||
telInvalid: 'Malformed phone number',
|
||||
|
||||
@ -5,9 +5,7 @@ export default {
|
||||
confirm: 'Confirmar',
|
||||
cancel: 'Cancelar',
|
||||
delete: 'Eliminar',
|
||||
complete: 'Completado',
|
||||
loading: 'Cargando...',
|
||||
telEmpty: 'Por favor rellena el teléfono',
|
||||
nameEmpty: 'Por favor rellena el nombre',
|
||||
confirmDelete: 'Estás seguro de eliminarlo?',
|
||||
telInvalid: 'Teléfono inválido',
|
||||
|
||||
@ -5,9 +5,7 @@ export default {
|
||||
confirm: 'Confirmer',
|
||||
cancel: 'Annuler',
|
||||
delete: 'Suprimer',
|
||||
complete: 'Terminé',
|
||||
loading: 'Chargement...',
|
||||
telEmpty: 'Veuillez remplir le tel',
|
||||
nameEmpty: 'Veuillez remplir le nom',
|
||||
confirmDelete: 'Êtes-vous sûr de vouloir supprimer?',
|
||||
telInvalid: 'Numéro de téléphone incorrect',
|
||||
|
||||
@ -5,9 +5,7 @@ export default {
|
||||
confirm: '確認',
|
||||
cancel: 'キャンセル',
|
||||
delete: '削除',
|
||||
complete: '完了',
|
||||
loading: '読み込み中...',
|
||||
telEmpty: '電話番号を入力してください',
|
||||
nameEmpty: '名前を入力してください',
|
||||
confirmDelete: '本当に削除しますか',
|
||||
telInvalid: '正しい電話番号を入力してください',
|
||||
|
||||
@ -5,9 +5,7 @@ export default {
|
||||
confirm: 'Bekreft',
|
||||
cancel: 'Avbryt',
|
||||
delete: 'Slett',
|
||||
complete: 'Fullfør',
|
||||
loading: 'Laster...',
|
||||
telEmpty: 'Vennligst fyll inn telefonnummer',
|
||||
nameEmpty: 'Vennligst fyll inn navn',
|
||||
confirmDelete: 'Er du sikker på at du vil slette?',
|
||||
telInvalid: 'Ugyldig telefonnummer',
|
||||
|
||||
@ -5,9 +5,7 @@ export default {
|
||||
confirm: 'Confirmă',
|
||||
cancel: 'Anulează',
|
||||
delete: 'Șterge',
|
||||
complete: 'Finalizează',
|
||||
loading: 'Încărcare...',
|
||||
telEmpty: 'Te rugăm să completezi telefonul',
|
||||
nameEmpty: 'Te rugăm să completezi numele',
|
||||
confirmDelete: 'Ești sigur ca vrei sa stergi?',
|
||||
telInvalid: 'Număr de telefon invalid',
|
||||
|
||||
@ -5,9 +5,7 @@ export default {
|
||||
confirm: 'Подтвердить',
|
||||
cancel: 'Отмена',
|
||||
delete: 'Удалить',
|
||||
complete: 'Завершить',
|
||||
loading: 'Загрузка...',
|
||||
telEmpty: 'Пожалуйста укажите телефон',
|
||||
nameEmpty: 'Пожалуйста укажите имя',
|
||||
confirmDelete: 'Вы уверены, что хотите удалить?',
|
||||
telInvalid: 'Некорректный номер телефона',
|
||||
|
||||
@ -5,9 +5,7 @@ export default {
|
||||
confirm: 'ยืนยัน',
|
||||
cancel: 'ยกเลิก',
|
||||
delete: 'ลบ',
|
||||
complete: 'ดำเนินการ',
|
||||
loading: 'กำลังโหลด...',
|
||||
telEmpty: 'กรุณากรอกข้อมูลในโทรศัพท์',
|
||||
nameEmpty: 'กรุณากรอกชื่อของคุณ',
|
||||
confirmDelete: 'คุณแน่ใจว่าต้องการลบ',
|
||||
telInvalid: 'กรุณากรอกหมายเลขโทรศัพท์ที่ถูกต้อง',
|
||||
|
||||
@ -5,9 +5,7 @@ export default {
|
||||
confirm: 'Onayla',
|
||||
cancel: 'İptal',
|
||||
delete: 'Sil',
|
||||
complete: 'Tamamla',
|
||||
loading: 'Yükleniyor...',
|
||||
telEmpty: 'Lütfen tel. no giriniz',
|
||||
nameEmpty: 'Lütfen isim giriniz',
|
||||
confirmDelete: 'Silmek istediğinize emin misiniz?',
|
||||
telInvalid: 'Geçersiz tel. numarası',
|
||||
|
||||
@ -5,9 +5,7 @@ export default {
|
||||
confirm: '确认',
|
||||
cancel: '取消',
|
||||
delete: '删除',
|
||||
complete: '完成',
|
||||
loading: '加载中...',
|
||||
telEmpty: '请填写电话',
|
||||
nameEmpty: '请填写姓名',
|
||||
confirmDelete: '确定要删除吗',
|
||||
telInvalid: '请输入正确的电话',
|
||||
|
||||
@ -5,9 +5,7 @@ export default {
|
||||
confirm: '確認',
|
||||
cancel: '取消',
|
||||
delete: '刪除',
|
||||
complete: '完成',
|
||||
loading: '加載中...',
|
||||
telEmpty: '請填寫電話',
|
||||
nameEmpty: '請填寫姓名',
|
||||
confirmDelete: '確定要刪除嗎',
|
||||
telInvalid: '請填寫正確的電話',
|
||||
|
||||
@ -5,9 +5,7 @@ export default {
|
||||
confirm: '確認',
|
||||
cancel: '取消',
|
||||
delete: '刪除',
|
||||
complete: '完成',
|
||||
loading: '載入中...',
|
||||
telEmpty: '請填寫電話',
|
||||
nameEmpty: '請填寫姓名',
|
||||
confirmDelete: '確定要刪除嗎',
|
||||
telInvalid: '請填寫正確的電話',
|
||||
|
||||
@ -118,6 +118,14 @@ export default {
|
||||
| onOpened | Callback function after opened | _() => void_ | - |
|
||||
| onClose | Callback function after close | _() => void_ | - |
|
||||
|
||||
### Types
|
||||
|
||||
The component exports the following type definitions:
|
||||
|
||||
```ts
|
||||
import type { NotifyType, NotifyOptions } from 'vant';
|
||||
```
|
||||
|
||||
## Theming
|
||||
|
||||
### CSS Variables
|
||||
|
||||
@ -151,6 +151,14 @@ export default {
|
||||
| onOpened | 完全展示后的回调函数 | _() => void_ | - |
|
||||
| onClose | 关闭时的回调函数 | _() => void_ | - |
|
||||
|
||||
### 类型定义
|
||||
|
||||
组件导出以下类型定义:
|
||||
|
||||
```ts
|
||||
import type { NotifyType, NotifyOptions } from 'vant';
|
||||
```
|
||||
|
||||
## 主题定制
|
||||
|
||||
### 样式变量
|
||||
|
||||
@ -189,7 +189,7 @@ export default {
|
||||
|
||||
| Event | Description | Arguments |
|
||||
| --- | --- | --- |
|
||||
| input | Emitted when keydown | key: Content of the key |
|
||||
| input | Emitted when a key is pressed | key: Content of the key |
|
||||
| delete | Emitted when the delete key is pressed | - |
|
||||
| close | Emitted when the close button is clicked | - |
|
||||
| blur | Emitted when the close button is clicked or the keyboard is blurred | - |
|
||||
@ -204,6 +204,14 @@ export default {
|
||||
| extra-key | Custom extra key content |
|
||||
| title-left | Custom title left content |
|
||||
|
||||
### Types
|
||||
|
||||
The component exports the following type definitions:
|
||||
|
||||
```ts
|
||||
import type { NumberKeyboardTheme } from 'vant';
|
||||
```
|
||||
|
||||
## Theming
|
||||
|
||||
### CSS Variables
|
||||
|
||||
@ -211,6 +211,14 @@ export default {
|
||||
| extra-key | 自定义左下角按键内容 |
|
||||
| title-left | 自定义标题栏左侧内容 |
|
||||
|
||||
### 类型定义
|
||||
|
||||
组件导出以下类型定义:
|
||||
|
||||
```ts
|
||||
import type { NumberKeyboardTheme } from 'vant';
|
||||
```
|
||||
|
||||
## 主题定制
|
||||
|
||||
### 样式变量
|
||||
|
||||
@ -93,8 +93,16 @@ export default {
|
||||
| Name | Description | SlotProps |
|
||||
| --- | --- | --- |
|
||||
| page | Custom pagination item | _{ number: number, text: string, active: boolean }_ |
|
||||
| prev-text | Custom prev text | `-` |
|
||||
| next-text | Custom next text | `-` |
|
||||
| prev-text | Custom prev text | - |
|
||||
| next-text | Custom next text | - |
|
||||
|
||||
### Types
|
||||
|
||||
The component exports the following type definitions:
|
||||
|
||||
```ts
|
||||
import type { PaginationMode } from 'vant';
|
||||
```
|
||||
|
||||
## Theming
|
||||
|
||||
|
||||
@ -101,8 +101,16 @@ export default {
|
||||
| 名称 | 描述 | 参数 |
|
||||
| --- | --- | --- |
|
||||
| page | 自定义页码 | _{ number: number, text: string, active: boolean }_ |
|
||||
| prev-text | 自定义上一页按钮文字 | `-` |
|
||||
| next-text | 自定义下一页按钮文字 | `-` |
|
||||
| prev-text | 自定义上一页按钮文字 | - |
|
||||
| next-text | 自定义下一页按钮文字 | - |
|
||||
|
||||
### 类型定义
|
||||
|
||||
组件导出以下类型定义:
|
||||
|
||||
```ts
|
||||
import type { PaginationMode } from 'vant';
|
||||
```
|
||||
|
||||
## 主题定制
|
||||
|
||||
|
||||
@ -211,10 +211,10 @@ export default {
|
||||
| Attribute | Description | Type | Default |
|
||||
| --- | --- | --- | --- |
|
||||
| v-model:show | Whether to show Popover | _boolean_ | `false` |
|
||||
| actions | Actions | _Action[]_ | `[]` |
|
||||
| placement | Placement | _string_ | `bottom` |
|
||||
| theme | Theme,can be set to `dark` | _string_ | `light` |
|
||||
| trigger | Trigger mode,can be set to `manual` | `click` |
|
||||
| actions | Actions | _PopoverAction[]_ | `[]` |
|
||||
| placement | Placement | _PopoverPlacement_ | `bottom` |
|
||||
| theme | Theme,can be set to `dark` | _PopoverTheme_ | `light` |
|
||||
| trigger | Trigger mode,can be set to `manual` | _PopoverTrigger_ | `click` |
|
||||
| duration | Transition duration, unit second | _number \| string_ | `0.3` |
|
||||
| offset | Distance to reference | _[number, number]_ | `[0, 8]` |
|
||||
| overlay | Whether to show overlay | _boolean_ | `false` |
|
||||
@ -226,7 +226,7 @@ export default {
|
||||
| teleport | Specifies a target element where Popover will be mounted | _string \| Element_ | `body` |
|
||||
| icon-prefix `v3.0.17` | Icon className prefix | _string_ | `van-icon` |
|
||||
|
||||
### Data Structure of Action
|
||||
### Data Structure of PopoverAction
|
||||
|
||||
| Key | Description | Type |
|
||||
| --------- | ----------------------- | --------------------------- |
|
||||
@ -254,6 +254,19 @@ export default {
|
||||
| default | Custom content |
|
||||
| reference | Reference Element |
|
||||
|
||||
### Types
|
||||
|
||||
The component exports the following type definitions:
|
||||
|
||||
```ts
|
||||
import type {
|
||||
PopoverTheme,
|
||||
PopoverAction,
|
||||
PopoverTrigger,
|
||||
PopoverPlacement,
|
||||
} from 'vant';
|
||||
```
|
||||
|
||||
## Theming
|
||||
|
||||
### CSS Variables
|
||||
|
||||
@ -221,10 +221,10 @@ export default {
|
||||
| 参数 | 说明 | 类型 | 默认值 |
|
||||
| --- | --- | --- | --- |
|
||||
| v-model:show | 是否展示气泡弹出层 | _boolean_ | `false` |
|
||||
| actions | 选项列表 | _Action[]_ | `[]` |
|
||||
| placement | 弹出位置 | _string_ | `bottom` |
|
||||
| theme | 主题风格,可选值为 `dark` | _string_ | `light` |
|
||||
| trigger | 触发方式,可选值为 `manual` | `click` |
|
||||
| actions | 选项列表 | _PopoverAction[]_ | `[]` |
|
||||
| placement | 弹出位置 | _PopoverPlacement_ | `bottom` |
|
||||
| theme | 主题风格,可选值为 `dark` | _PopoverTheme_ | `light` |
|
||||
| trigger | 触发方式,可选值为 `manual` | _PopoverTrigger_ | `click` |
|
||||
| duration | 动画时长,单位秒,设置为 0 可以禁用动画 | _number \| string_ | `0.3` |
|
||||
| offset | 出现位置的偏移量 | _[number, number]_ | `[0, 8]` |
|
||||
| overlay | 是否显示遮罩层 | _boolean_ | `false` |
|
||||
@ -236,7 +236,7 @@ export default {
|
||||
| teleport | 指定挂载的节点,等同于 Teleport 组件的 [to 属性](https://v3.cn.vuejs.org/api/built-in-components.html#teleport) | _string \| Element_ | `body` |
|
||||
| icon-prefix `v3.0.17` | 图标类名前缀,等同于 Icon 组件的 [class-prefix 属性](#/zh-CN/icon#props) | _string_ | `van-icon` |
|
||||
|
||||
### Action 数据结构
|
||||
### PopoverAction 数据结构
|
||||
|
||||
`actions` 属性是一个由对象构成的数组,数组中的每个对象配置一列,对象可以包含以下值:
|
||||
|
||||
@ -266,6 +266,19 @@ export default {
|
||||
| default | 自定义菜单内容 |
|
||||
| reference | 触发 Popover 显示的元素内容 |
|
||||
|
||||
### 类型定义
|
||||
|
||||
组件导出以下类型定义:
|
||||
|
||||
```ts
|
||||
import type {
|
||||
PopoverTheme,
|
||||
PopoverAction,
|
||||
PopoverTrigger,
|
||||
PopoverPlacement,
|
||||
} from 'vant';
|
||||
```
|
||||
|
||||
## 主题定制
|
||||
|
||||
### 样式变量
|
||||
|
||||
@ -146,6 +146,14 @@ Use `teleport` prop to specify mount location.
|
||||
| default | Content of Popup |
|
||||
| overlay-content `v3.0.18` | Content of Popup overlay |
|
||||
|
||||
### Types
|
||||
|
||||
The component exports the following type definitions:
|
||||
|
||||
```ts
|
||||
import type { PopupPosition, PopupCloseIconPosition } from 'vant';
|
||||
```
|
||||
|
||||
## Theming
|
||||
|
||||
### CSS Variables
|
||||
|
||||
@ -152,6 +152,14 @@ export default {
|
||||
| default | 弹窗内容 |
|
||||
| overlay-content `v3.0.18` | 遮罩层的内容 |
|
||||
|
||||
### 类型定义
|
||||
|
||||
组件导出以下类型定义:
|
||||
|
||||
```ts
|
||||
import type { PopupPosition, PopupCloseIconPosition } from 'vant';
|
||||
```
|
||||
|
||||
## 主题定制
|
||||
|
||||
### 样式变量
|
||||
|
||||
@ -214,6 +214,14 @@ export default {
|
||||
| description | Custom description |
|
||||
| cancel `v3.0.10` | Custom the content of cancel button |
|
||||
|
||||
### Types
|
||||
|
||||
The component exports the following type definitions:
|
||||
|
||||
```ts
|
||||
import type { ShareSheetOption, ShareSheetOptions } from 'vant';
|
||||
```
|
||||
|
||||
## Theming
|
||||
|
||||
### CSS Variables
|
||||
|
||||
@ -228,6 +228,14 @@ export default {
|
||||
| description | 自定义描述文字 |
|
||||
| cancel `v3.0.10` | 自定义取消按钮内容 |
|
||||
|
||||
### 类型定义
|
||||
|
||||
组件导出以下类型定义:
|
||||
|
||||
```ts
|
||||
import type { ShareSheetOption, ShareSheetOptions } from 'vant';
|
||||
```
|
||||
|
||||
## 主题定制
|
||||
|
||||
### 样式变量
|
||||
|
||||
@ -157,6 +157,14 @@ export default {
|
||||
| focus | Emitted when the input is focused | _event: Event_ |
|
||||
| blur | Emitted when the input is blurred | _event: Event_ |
|
||||
|
||||
### Types
|
||||
|
||||
The component exports the following type definitions:
|
||||
|
||||
```ts
|
||||
import type { StepperTheme } from 'vant';
|
||||
```
|
||||
|
||||
## Theming
|
||||
|
||||
### CSS Variables
|
||||
|
||||
@ -177,6 +177,14 @@ export default {
|
||||
| focus | 输入框聚焦时触发 | _event: Event_ |
|
||||
| blur | 输入框失焦时触发 | _event: Event_ |
|
||||
|
||||
### 类型定义
|
||||
|
||||
组件导出以下类型定义:
|
||||
|
||||
```ts
|
||||
import type { StepperTheme } from 'vant';
|
||||
```
|
||||
|
||||
## 主题定制
|
||||
|
||||
### 样式变量
|
||||
|
||||
@ -80,6 +80,14 @@ export default {
|
||||
| change `v3.0.10` | Emitted when sticky status changed | _isFixed: boolean_ |
|
||||
| scroll | Emitted when scrolling | _{ scrollTop: number, isFixed: boolean }_ |
|
||||
|
||||
### Types
|
||||
|
||||
The component exports the following type definitions:
|
||||
|
||||
```ts
|
||||
import type { StickyPosition } from 'vant';
|
||||
```
|
||||
|
||||
## Theming
|
||||
|
||||
### CSS Variables
|
||||
|
||||
@ -88,6 +88,14 @@ export default {
|
||||
| change `v3.0.10` | 当吸顶状态改变时触发 | _isFixed: boolean_ |
|
||||
| scroll | 滚动时触发 | _{ scrollTop: number, isFixed: boolean }_ |
|
||||
|
||||
### 类型定义
|
||||
|
||||
组件导出以下类型定义:
|
||||
|
||||
```ts
|
||||
import type { StickyPosition } from 'vant';
|
||||
```
|
||||
|
||||
## 主题定制
|
||||
|
||||
### 样式变量
|
||||
|
||||
@ -155,8 +155,8 @@ Toast.resetDefaultOptions('loading');
|
||||
|
||||
| Attribute | Description | Type | Default |
|
||||
| --- | --- | --- | --- |
|
||||
| type | Can be set to `loading` `success` `fail` `html` | _string_ | `text` |
|
||||
| position | Can be set to `top` `middle` `bottom` | _string_ | `middle` |
|
||||
| type | Can be set to `loading` `success` `fail` `html` | _ToastType_ | `text` |
|
||||
| position | Can be set to `top` `middle` `bottom` | _ToastPosition_ | `middle` |
|
||||
| message | Message | _string_ | `''` |
|
||||
| icon | Custom icon | _string_ | - |
|
||||
| iconSize | Custom icon size | _number \| string_ | `36px` |
|
||||
@ -175,6 +175,14 @@ Toast.resetDefaultOptions('loading');
|
||||
| transition | Transition, equivalent to `name` prop of [transition](https://v3.vuejs.org/api/built-in-components.html#transition) | _string_ | `van-fade` |
|
||||
| teleport | Specifies a target element where Toast will be mounted | _string \| Element_ | `body` |
|
||||
|
||||
### Types
|
||||
|
||||
The component exports the following type definitions:
|
||||
|
||||
```ts
|
||||
import type { ToastType, ToastOptions, ToastPosition } from 'vant';
|
||||
```
|
||||
|
||||
## Theming
|
||||
|
||||
### CSS Variables
|
||||
|
||||
@ -162,12 +162,12 @@ Toast.resetDefaultOptions('loading');
|
||||
| Toast.setDefaultOptions | 修改默认配置,对所有 Toast 生效。<br>传入 type 可以修改指定类型的默认配置 | `type \| options` | `void` |
|
||||
| Toast.resetDefaultOptions | 重置默认配置,对所有 Toast 生效。<br>传入 type 可以重置指定类型的默认配置 | `type` | `void` |
|
||||
|
||||
### Options
|
||||
### ToastOptions 数据结构
|
||||
|
||||
| 参数 | 说明 | 类型 | 默认值 |
|
||||
| --- | --- | --- | --- |
|
||||
| type | 提示类型,可选值为 `loading` `success`<br>`fail` `html` | _string_ | `text` |
|
||||
| position | 位置,可选值为 `top` `bottom` | _string_ | `middle` |
|
||||
| type | 提示类型,可选值为 `loading` `success`<br>`fail` `html` | _ToastType_ | `text` |
|
||||
| position | 位置,可选值为 `top` `bottom` | _ToastPosition_ | `middle` |
|
||||
| message | 文本内容,支持通过`\n`换行 | _string_ | `''` |
|
||||
| icon | 自定义图标,支持传入[图标名称](#/zh-CN/icon)或图片链接 | _string_ | - |
|
||||
| iconSize | 图标大小,如 `20px` `2em`,默认单位为 `px` | _number \| string_ | `36px` |
|
||||
@ -186,6 +186,14 @@ Toast.resetDefaultOptions('loading');
|
||||
| transition | 动画类名,等价于 [transition](https://v3.cn.vuejs.org/api/built-in-components.html#transition) 的`name`属性 | _string_ | `van-fade` |
|
||||
| teleport | 指定挂载的节点,等同于 Teleport 组件的 [to 属性](https://v3.cn.vuejs.org/api/built-in-components.html#teleport) | _string \| Element_ | `body` |
|
||||
|
||||
### 类型定义
|
||||
|
||||
组件导出以下类型定义:
|
||||
|
||||
```ts
|
||||
import type { ToastType, ToastOptions, ToastPosition } from 'vant';
|
||||
```
|
||||
|
||||
## 主题定制
|
||||
|
||||
### 样式变量
|
||||
|
||||
@ -228,6 +228,14 @@ In every tree object, `text` property defines `id` stands for the unique key whi
|
||||
];
|
||||
```
|
||||
|
||||
### Types
|
||||
|
||||
The component exports the following type definitions:
|
||||
|
||||
```ts
|
||||
import type { TreeSelectItem, TreeSelectChild } from 'vant';
|
||||
```
|
||||
|
||||
## Theming
|
||||
|
||||
### CSS Variables
|
||||
|
||||
@ -234,6 +234,14 @@ export default {
|
||||
];
|
||||
```
|
||||
|
||||
### 类型定义
|
||||
|
||||
组件导出以下类型定义:
|
||||
|
||||
```ts
|
||||
import type { TreeSelectItem, TreeSelectChild } from 'vant';
|
||||
```
|
||||
|
||||
## 主题定制
|
||||
|
||||
### 样式变量
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
import { deepClone } from '../deep-clone';
|
||||
import { deepAssign } from '../deep-assign';
|
||||
import { get, noop } from '..';
|
||||
import { isDef, isMobile, isNumeric, isAndroid } from '../validate';
|
||||
import { isDef, isMobile, isNumeric } from '../validate';
|
||||
import { camelize } from '../format/string';
|
||||
import { formatNumber } from '../format/number';
|
||||
import { addUnit, unitToPx } from '../format/unit';
|
||||
@ -57,10 +57,6 @@ test('get', () => {
|
||||
expect(get({ a: { b: 2 } }, 'a.b.c')).toEqual('');
|
||||
});
|
||||
|
||||
test('isAndroid', () => {
|
||||
expect(isAndroid()).toBeFalsy();
|
||||
});
|
||||
|
||||
test('isMobile', () => {
|
||||
expect(isMobile('13000000000')).toBeTruthy();
|
||||
expect(isMobile('+8613000000000')).toBeTruthy();
|
||||
|
||||
@ -35,10 +35,6 @@ export function isNumeric(val: string | number): val is string {
|
||||
return typeof val === 'number' || /^\d+(\.\d+)?$/.test(val);
|
||||
}
|
||||
|
||||
export function isAndroid(): boolean {
|
||||
return inBrowser ? /android/.test(navigator.userAgent.toLowerCase()) : false;
|
||||
}
|
||||
|
||||
export function isIOS(): boolean {
|
||||
return inBrowser
|
||||
? /ios|iphone|ipad|ipod/.test(navigator.userAgent.toLowerCase())
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user