table相關(guān)經(jīng)驗(yàn)

1.rowKey
表格行 key 的取值，可以是字符串或一個(gè)函數(shù) (這個(gè)指定每一行的主鍵)
2.columns
(1)dataIndex 唯一標(biāo)識(shí) 用來對(duì)應(yīng)數(shù)據(jù)中的數(shù)據(jù)項(xiàng),有dataindex后就可以不用key 支持?jǐn)?shù)組??(這種用法可以試試)
(2)className:列樣式類名
(3)render:參數(shù)(text, record, index) 生成復(fù)雜數(shù)據(jù)的渲染函數(shù)，參數(shù)分別為當(dāng)前行的值，當(dāng)前行數(shù)據(jù)，行索引,也可以直接用一個(gè)data參數(shù)(data) data表示當(dāng)前行的數(shù)據(jù)對(duì)象

image.png

用來自己渲染對(duì)應(yīng)的表格

form相關(guān)經(jīng)驗(yàn)

formItem中如果有多個(gè)組件需要給每一個(gè)組件設(shè)置單獨(dú)的key

upload相關(guān)經(jīng)驗(yàn)

1.beforeUpload:用來檢驗(yàn)文件的格式,大小等問題,并需要存儲(chǔ)該函數(shù)的參數(shù)file 因?yàn)檫@個(gè)file參數(shù)是File類型的 發(fā)送請(qǐng)求時(shí)需要傳遞這個(gè)類型的文件
function beforeUpload(file, name) {
//判斷類型與大小
let isJpgOrPng;
let largeLimit;
if (name == 'cover') {
setIsCoverTip(false);
isJpgOrPng = file.type === 'image/jpeg' || file.type === 'image/png';
largeLimit = file.size / 1024 < 200;
} else {
setIsVideoTip(false)
isJpgOrPng = file.type === 'video/*' || file.type === 'video/quicktime';
largeLimit = file.size / 1024 / 1024 < 200;
}

    if (!isJpgOrPng) {
        message.error('圖片只能傳jpeg與png文件,視頻只能傳mov文件');
    }
    if (!largeLimit) {
        message.error('圖片必須小于200k,視頻必須小于200mb');
    }

//將file文件傳入表單項(xiàng) 使用setFields函數(shù)
if (isJpgOrPng && largeLimit) {
Myform.setFields([{
name: name,
value: file
}])
}
return isJpgOrPng && largeLimit;
}
2.onChange:一般用來確定文件上傳進(jìn)度
const handleChange = (info, name) => {
if (info.file.status === 'uploading') {
if (name == 'cover') {
setCoverLoading(true)
} else {
setvideoloading(true)
}
return;
}
if (info.file.status === 'done') {
if (name == 'cover') {
setCoverLoading(false)
} else {
setvideoloading(false)
}
return;
}
};
所以為什么不在onChange中文件傳輸完成后設(shè)置file呢?因?yàn)樵搃nfo.file不是File類型的 所有不能用來傳輸 ,而且在beforeUpload中進(jìn)行大小類型判斷完的file文件已經(jīng)具備了發(fā)送請(qǐng)求的要求
3.maxCount 設(shè)置最多上傳文件的個(gè)數(shù)
4.文件需要放入formData中進(jìn)行發(fā)送請(qǐng)求