github
/
ant-design-vue
mirror of https://github.com/vueComponent/ant-design-vue
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

feat: update result (#2362) 

* feat: update result

* fix: upate

* fix: default
pull/2373/head
xrkffgg 2020-06-08 14:53:35 +08:00 committed by GitHub
parent 4dc73e9b83
commit 19e999a1b5
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 16 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

25
components/result/index.jsx
View File

@ -1,11 +1,11 @@
import { inject } from 'vue';
import PropTypes from '../_util/vue-types'; import PropTypes from '../_util/vue-types';
import { getComponentFromProp } from '../_util/props-util'; import { getComponent } from '../_util/props-util';
import { ConfigConsumerProps } from '../config-provider'; import { ConfigConsumerProps } from '../config-provider';
import CheckCircleFilled from '@ant-design/icons-vue/CheckCircleFilled'; import CheckCircleFilled from '@ant-design/icons-vue/CheckCircleFilled';
import CloseCircleFilled from '@ant-design/icons-vue/CloseCircleFilled'; import CloseCircleFilled from '@ant-design/icons-vue/CloseCircleFilled';
import ExclamationCircleFilled from '@ant-design/icons-vue/ExclamationCircleFilled'; import ExclamationCircleFilled from '@ant-design/icons-vue/ExclamationCircleFilled';
import WarningFilled from '@ant-design/icons-vue/WarningFilled'; import WarningFilled from '@ant-design/icons-vue/WarningFilled';
import Base from '../base';
import noFound from './noFound'; import noFound from './noFound';
import serverError from './serverError'; import serverError from './serverError';
import unauthorized from './unauthorized'; import unauthorized from './unauthorized';
@ -55,25 +55,27 @@ const renderExtra = (h, prefixCls, extra) =>
const Result = { const Result = {
name: 'AResult', name: 'AResult',
props: ResultProps, props: ResultProps,
inject: { setup() {
configProvider: { default: () => ConfigConsumerProps }, return {
configProvider: inject('configProvider', ConfigConsumerProps),
};
}, },
render(h) { render(h) {
const { prefixCls: customizePrefixCls, status } = this; const { prefixCls: customizePrefixCls, status } = this;
const getPrefixCls = this.configProvider.getPrefixCls; const getPrefixCls = this.configProvider.getPrefixCls;
const prefixCls = getPrefixCls('result', customizePrefixCls); const prefixCls = getPrefixCls('result', customizePrefixCls);
const title = getComponentFromProp(this, 'title'); const title = getComponent(this, 'title');
const subTitle = getComponentFromProp(this, 'subTitle'); const subTitle = getComponent(this, 'subTitle');
const icon = getComponentFromProp(this, 'icon'); const icon = getComponent(this, 'icon');
const extra = getComponentFromProp(this, 'extra'); const extra = getComponent(this, 'extra');
return ( return (
<div class={`${prefixCls} ${prefixCls}-${status}`}> <div class={`${prefixCls} ${prefixCls}-${status}`}>
{renderIcon(h, prefixCls, { status, icon })} {renderIcon(h, prefixCls, { status, icon })}
<div class={`${prefixCls}-title`}>{title}</div> <div class={`${prefixCls}-title`}>{title}</div>
{subTitle && <div class={`${prefixCls}-subtitle`}>{subTitle}</div>} {subTitle && <div class={`${prefixCls}-subtitle`}>{subTitle}</div>}
{this.$slots.default && <div class={`${prefixCls}-content`}>{this.$slots.default}</div>} {this.$slots.default && <div class={`${prefixCls}-content`}>{this.$slots.default()}</div>}
{renderExtra(h, prefixCls, extra)} {renderExtra(h, prefixCls, extra)}
</div> </div>
); );
@ -86,8 +88,7 @@ Result.PRESENTED_IMAGE_404 = ExceptionMap[404];
Result.PRESENTED_IMAGE_500 = ExceptionMap[500]; Result.PRESENTED_IMAGE_500 = ExceptionMap[500];
/* istanbul ignore next */ /* istanbul ignore next */
Result.install = function(Vue) { Result.install = function(app) {
Vue.use(Base); app.component(Result.name, Result);
Vue.component(Result.name, Result);
}; };
export default Result; export default Result;

4
examples/index.js
View File

@ -7,7 +7,8 @@ import Affix from 'ant-design-vue/affix';
import Alert from 'ant-design-vue/alert'; import Alert from 'ant-design-vue/alert';
import Divider from 'ant-design-vue/divider'; import Divider from 'ant-design-vue/divider';
import ConfigProvider from 'ant-design-vue/config-provider'; import ConfigProvider from 'ant-design-vue/config-provider';
import Spin from 'ant-design-vue/Spin'; import Result from 'ant-design-vue/result';
import Spin from 'ant-design-vue/spin';
import Empty from 'ant-design-vue/empty'; import Empty from 'ant-design-vue/empty';
import 'ant-design-vue/style.js'; import 'ant-design-vue/style.js';
@ -18,6 +19,7 @@ createApp(App)
.use(Affix) .use(Affix)
.use(Alert) .use(Alert)
.use(Divider) .use(Divider)
.use(Result)
.use(Spin) .use(Spin)
.use(Empty) .use(Empty)
.mount('#app'); .mount('#app');