doc: update table

pull/5361/head
tangjinzhou 2022-03-17 15:39:19 +08:00
parent 625efff1fa
commit bac864ff83
5 changed files with 19 additions and 15 deletions

View File

@ -90,7 +90,7 @@ export { default as Image, ImagePreviewGroup } from './image';
export type { InputNumberProps } from './input-number';
export { default as InputNumber } from './input-number';
export type { LayoutProps } from './layout';
export type { LayoutProps, SiderProps } from './layout';
export {
default as Layout,
LayoutHeader,

View File

@ -13,6 +13,7 @@ import { uploadProps } from './interface';
import { file2Obj, getFileItem, removeFileItem, updateFileList } from './utils';
import { useLocaleReceiver } from '../locale-provider/LocaleReceiver';
import defaultLocale from '../locale/default';
import type { CSSProperties } from 'vue';
import { computed, defineComponent, onMounted, ref, toRef } from 'vue';
import { flattenChildren, initDefaultProps } from '../_util/props-util';
import useMergedState from '../_util/hooks/useMergedState';
@ -295,7 +296,7 @@ export default defineComponent({
defaultLocale.Upload,
computed(() => props.locale),
);
const renderUploadList = (button?: VueNode) => {
const renderUploadList = (button?: VueNode, buttonVisible?: boolean) => {
const {
removeIcon,
previewIcon,
@ -331,6 +332,7 @@ export default defineComponent({
isImageUrl={isImageUrl}
progress={progress}
itemRender={itemRender}
appendActionVisible={buttonVisible}
v-slots={{ ...slots, appendAction: () => button }}
/>
) : (
@ -403,11 +405,8 @@ export default defineComponent({
[`${prefixCls.value}-rtl`]: direction.value === 'rtl',
});
const children = flattenChildren(slots.default?.());
const uploadButton = (
<div
class={uploadButtonCls}
style={children && children.length ? undefined : { display: 'none' }}
>
const renderUploadButton = (uploadButtonStyle?: CSSProperties) => (
<div class={uploadButtonCls} style={uploadButtonStyle}>
<VcUpload {...rcUploadProps} ref={upload} v-slots={slots} />
</div>
);
@ -415,13 +414,13 @@ export default defineComponent({
if (listType === 'picture-card') {
return (
<span class={classNames(`${prefixCls.value}-picture-card-wrapper`, attrs.class)}>
{renderUploadList(uploadButton)}
{renderUploadList(renderUploadButton(), !!(children && children.length))}
</span>
);
}
return (
<span class={attrs.class}>
{uploadButton}
{renderUploadButton(children && children.length ? undefined : { display: 'none' })}
{renderUploadList()}
</span>
);

View File

@ -33,6 +33,7 @@ export default defineComponent({
previewFile: previewImage,
isImageUrl,
items: [],
appendActionVisible: true,
}),
setup(props, { slots, expose }) {
const motionAppear = ref(false);
@ -167,6 +168,7 @@ export default defineComponent({
progress,
appendAction = slots.appendAction,
itemRender,
appendActionVisible,
} = props;
const appendActionDom = appendAction?.()[0];
return (
@ -201,7 +203,7 @@ export default defineComponent({
/>
);
})}
{isValidElement(appendActionDom) ? (
{appendActionVisible && isValidElement(appendActionDom) ? (
<HackSlot key="__ant_upload_appendAction">{appendActionDom}</HackSlot>
) : null}
</TransitionGroup>

View File

@ -105,7 +105,7 @@ When uploading state change, it returns:
## FAQ
### How to implement upload server side?
### How do I implement upload server side?
- You can consult [jQuery-File-Upload](https://github.com/blueimp/jQuery-File-Upload/wiki#server-side) about how to implement server side upload interface.
- There is a mock example of [express](https://github.com/react-component/upload/blob/master/server.js) in rc-upload.
@ -118,10 +118,10 @@ Please set property `url` of each item in `fileList` to control content of link.
See <https://github.com/react-component/upload#customrequest>.
### Why `fileList` in control will not trigger `change` `status` update when file not in the list?
### Why will the `fileList` that's in control not trigger `change` `status` update when the file is not in the list?
`change` only trigger when file in the list, it will ignore left events when removed from the list. Please note that there exist bug which makes event still trigger even the file is not in the list before `3.0.0-beta.10`.
### Why sometime `change` return File object and sometime return { originFileObj: File }?
### Why does `change` sometimes return File object and other times return { originFileObj: File }?
For compatible case, we return File object when `beforeUpload` return `false`. It will merge to `{ originFileObj: File }` in next major version. Current version is compatible to get origin file by `info.file.originFileObj`. You can change this before major release.

View File

@ -114,8 +114,10 @@ function uploadProps<T = any>() {
FileList: FileType[],
) => BeforeUploadValueType | Promise<BeforeUploadValueType>
>,
onChange: Function as PropType<(info: UploadChangeParam<T>) => void>,
'onUpdate:fileList': Function as PropType<(fileList: UploadChangeParam<T>['fileList']) => void>,
onChange: Function as PropType<(info: UploadChangeParam<UploadFile<T>>) => void>,
'onUpdate:fileList': Function as PropType<
(fileList: UploadChangeParam<UploadFile<T>>['fileList']) => void
>,
onDrop: Function as PropType<(event: DragEvent) => void>,
listType: String as PropType<UploadListType>,
onPreview: Function as PropType<(file: UploadFile<T>) => void>,
@ -181,6 +183,7 @@ function uploadListProps<T = any>() {
>,
isImageUrl: Function as PropType<(file: UploadFile) => boolean>,
appendAction: Function as PropType<() => VueNode>,
appendActionVisible: { type: Boolean, default: undefined },
itemRender: Function as PropType<ItemRender<T>>,
};
}