diff --git a/demo/pages/Empty/index.acss b/demo/pages/Empty/index.acss index 286b65082..fe01c3395 100644 --- a/demo/pages/Empty/index.acss +++ b/demo/pages/Empty/index.acss @@ -1,17 +1,3 @@ page { - padding: 24rpx; -} - -.demo-empty-btn { - margin-top: 40rpx; -} - -.demo-empty-btn-main, -.demo-empty-btn-sub { - margin: 0 12rpx; -} - -.demo-empty-container-image { - width: 200rpx; - height: 170rpx; + padding: 12px; } diff --git a/demo/pages/Empty/index.axml b/demo/pages/Empty/index.axml index 32324c7d6..c12e9d708 100644 --- a/demo/pages/Empty/index.axml +++ b/demo/pages/Empty/index.axml @@ -1,60 +1,24 @@ - + + + - - - - - - + + + + + + + + - - - - - - - - - - - - - - - - - - - - - - - - - - - - \ No newline at end of file + + + diff --git a/demo/pages/Empty/index.js b/demo/pages/Empty/index.js index e1d471912..a83641f97 100644 --- a/demo/pages/Empty/index.js +++ b/demo/pages/Empty/index.js @@ -10,19 +10,4 @@ Page({ value: 'section', }] }, - onSubBtnClick() { - my.alert({ - title: '你点击了按钮1', - }); - }, - onMainBtnClick() { - my.alert({ - title: '你点击了按钮2', - }); - }, - handleChangeMode(v) { - this.setData({ - mode: v - }) - } }); diff --git a/src/Empty/index.axml b/src/Empty/index.axml index 859b3d05b..dd5d15137 100644 --- a/src/Empty/index.axml +++ b/src/Empty/index.axml @@ -1,16 +1,24 @@ - - - - - - - {{title}} + + + + + + + + + + {{title}} + - - {{message}} + + + {{message}} + - + + + - \ No newline at end of file + diff --git a/src/Empty/index.less b/src/Empty/index.less index 7e44d68b2..557d4fcb8 100644 --- a/src/Empty/index.less +++ b/src/Empty/index.less @@ -3,59 +3,34 @@ @emptyPrefix: ant-empty; .@{emptyPrefix} { - &-page { - text-align: center; - padding-top: 25vh; + text-align: center; + margin-top: @empty-margin-large; - &-image { - margin: 0 auto; - width: 400 * @rpx; - height: 340 * @rpx; - background: url(@empty-image-url) no-repeat; - background-size: contain; - } - - &-text { - margin-top: @empty-margin-large; - - &-main { - color: @COLOR_TEXT_PRIMARY; - font-size: @empty-font-size-large; - } - - &-sub { - color: @COLOR_TEXT_ASSIST; - font-size: @empty-font-size-common; - margin-top: @v-spacing-standard; - } - } - } - - &-section { - text-align: center; - margin-top: @empty-margin-large; - - &-image { - margin: 0 auto; + &-image { + display: flex; + justify-content: center; + image { width: 200 * @rpx; height: 170 * @rpx; - background: url(@empty-image-url) no-repeat; - background-size: contain; } + } - &-text { - margin-top: @v-spacing-large; + &-text { + margin-top: @v-spacing-large; - &-main { - color: @COLOR_TEXT_PRIMARY; - font-size: @empty-font-size-large; - } + &-main { + color: @COLOR_TEXT_PRIMARY; + font-size: @empty-font-size-large; + } - &-sub { - color: @COLOR_TEXT_ASSIST; - font-size: @empty-font-size-common; - margin-top: @v-spacing-standard; - } + &-sub { + color: @COLOR_TEXT_ASSIST; + font-size: @empty-font-size-common; + margin-top: @v-spacing-standard; } } + + &-extra { + padding-top: 20px; + } } diff --git a/src/Empty/index.md b/src/Empty/index.md index 4137e9d4d..8ed16f430 100644 --- a/src/Empty/index.md +++ b/src/Empty/index.md @@ -21,11 +21,9 @@ toc: 'content' | 属性 | 说明 | 类型 | 默认值 | | -----|-----|-----|----- | | className | 根节点类名 | string | - | -| title | 标题文案 | string | - | -| image | 图片区内容 | slot | - | -| mode | 空状态模式,`page`(整页空状态) `section`(局部空状态) | string | `page` | -| message | 描述文案 | string | - | +| title | 标题文案 | string \| slot | - | +| image | 图片,可传入字符串作为图片地址 | string \| slot | - | +| message | 描述文案 | string \| slot | - | | style | 样式 | string | - | - diff --git a/src/Empty/props.d.ts b/src/Empty/props.d.ts index da65b919a..9a851cb76 100644 --- a/src/Empty/props.d.ts +++ b/src/Empty/props.d.ts @@ -7,21 +7,13 @@ import { IBaseProps } from '../_base'; export interface IEmptyProps extends IBaseProps { /** * @description 主文案 - * @default '这里什么都没有' */ - mainText: string; - - /** - * @description 空状态模式, 'page'表示整页空状态,'section'表示局部空状态 - * @default 'page' - */ - mode: 'page' | 'section'; + title?: string; /** * @description 副文案 - * @default '看看其它的吧' */ - subText: string; + message?: string; } export declare const EmptyDefaultProps: Partial; diff --git a/src/Empty/props.js b/src/Empty/props.js index aa6ac6651..f064fbf5c 100644 --- a/src/Empty/props.js +++ b/src/Empty/props.js @@ -1,4 +1,4 @@ export const EmptyDefaultProps = { - mode: 'page', + };