1.react相關(guān)問題:
? ? ? antd組件問題
? ? ? ? TreeSelect樹形選擇組件問題
? ? ? ? ? 樹形組件自帶模糊搜素問題:
? ? ? ? ? ? treeNodeFilterProp 屬性過濾設(shè)置 兩個(gè)種過濾方式 ‘value’ 和 ‘title’(文本)
? ? ? ? ? 樹形組件復(fù)選問題:
? ? ? ? ? ? showCheckedStrategy 屬性控制選中顯示子、父節(jié)點(diǎn) SHOW_ALL 和 SHOW_PAPENT(選中父節(jié)點(diǎn)時(shí),只顯示子節(jié)點(diǎn))
? ? ? ? ? 樹形組件數(shù)據(jù)量過大延遲顯示問題:
? ? ? ? ? ? treeDefaultExpandAll 樹形控制顯示全部節(jié)點(diǎn)還是只顯示父節(jié)點(diǎn) boolean
? ? ? ? Tree樹形選擇組件問題
? ? ? ? ? 場景:切換樹型組件的單選多選
? ? ? ? ? 問題1:切換時(shí)會(huì)存在頁面不渲染問題
? ? ? ? ? 解決方法:給Tree組件添加key值
? ? ? ? ? 問題2:舊版本存在加key值之后出現(xiàn)小三角無法展開問題;
? ? ? ? ? 原因:key值改變之后存在props傳值缺失問題
? ? ? ? ? 解決:去掉key沧奴,使用顯示隱藏實(shí)現(xiàn)組件刷新(vue中不能使用v-if);
? ? ? ? Form表單問題:
? ? ? ? ? 表單組件聯(lián)合Table組件使用時(shí)問題:
? ? ? ? ? ? 在 axios 請求時(shí)參數(shù) 直接從 props.form.getFieldsValue 獲取,Table頁數(shù)操作時(shí)存在bug(如:搜索框中有值姓蜂,不點(diǎn)搜索點(diǎn)擊頁面跳轉(zhuǎn)的情況下會(huì)出現(xiàn)搜索過濾),
? ? ? ? ? ? 解決辦法:按鈕操作判斷医吊,搜索按鈕可以傳遞一個(gè)值過去钱慢,傳參做三目判斷
? ? ? ? ? 表單自定義驗(yàn)證問題:
? ? ? ? ? ? 1.基本驗(yàn)證
? ? ? ? ? ? ? 比如:場景,使用表單驗(yàn)證文本域限制字節(jié)問題
? ? ? ? ? ? ? ? 中文占2字節(jié)卿堂,其他字符1字節(jié)
? ? ? ? ? ? ? 解決思路:getfieldDecorator(id,{
? ? ? ? ? ? ? ? ? ? ? ? rules:[
? ? ? ? ? ? ? ? ? ? ? ? ? ? {max:number,message:'字?jǐn)?shù)過長束莫!'}
? ? ? ? ? ? ? ? ? ? ? ? ]
? ? ? ? ? ? ? ? ? ? });//number 為函數(shù)里面正則驗(yàn)證處理之后返回的字符長度
? ? ? ? ? ? 2.自定義驗(yàn)證 validator 方法驗(yàn)證
? ? ? ? ? ? ? 問題1:
? ? ? ? ? ? ? ? 比如:場景,多種限制驗(yàn)證 直接使用會(huì)出現(xiàn)bug? 無法調(diào)用validateFields方法
? ? ? ? ? ? ? ? ? 例子:validator:async (rule,value,callback)=>{
? ? ? ? ? ? ? ? ? ? if(條件){
? ? ? ? ? ? ? ? ? ? ? await callback(‘驗(yàn)證錯(cuò)誤文本’)
? ? ? ? ? ? ? ? ? ? }else{
? ? ? ? ? ? ? ? ? ? ? await callback(‘驗(yàn)證錯(cuò)誤文本’)
? ? ? ? ? ? ? ? ? ? }else{
? ? ? ? ? ? ? ? ? ? ? await callback()//驗(yàn)證通過
? ? ? ? ? ? ? ? ? ? }
? ? ? ? ? ? ? ? bug原因:validator 異步問題草描,直接使用出現(xiàn)錯(cuò)誤無法捕獲
? ? ? ? ? ? ? ? 解決辦法:
? ? ? ? ? ? ? ? ? 1.使用async 和 await 或者使用 Promise 對象進(jìn)行包裹
? ? ? ? ? ? ? ? ? ? 例子:
? ? ? ? ? ? ? ? ? ? ? validator:(rule览绿,value,callback)=>{
? ? ? ? ? ? ? ? ? ? ? ? new Promise((resolve,reject)=>{
? ? ? ? ? ? ? ? ? ? ? ? ? if(條件){
? ? ? ? ? ? ? ? ? ? ? ? ? ? reject(callback(‘錯(cuò)誤文本’))穗慕;
? ? ? ? ? ? ? ? ? ? ? ? ? }else{
? ? ? ? ? ? ? ? ? ? ? ? ? ? resolve(callback())饿敲;//驗(yàn)證通過
? ? ? ? ? ? ? ? ? ? ? ? ? }
? ? ? ? ? ? ? ? ? ? ? ? })
? ? ? ? ? ? ? ? ? ? ? }
? ? ? ? ? ? ? <!-- 問題2:
? ? ? ? ? ? ? ? 比如:場景,自定義表單進(jìn)行input驗(yàn)證時(shí)逛绵,在默認(rèn)值initiaValue設(shè)置為undf
? ? ? ? ? ? ? ? 問題:提交觸發(fā)自定義校驗(yàn)會(huì)出現(xiàn)validateFields和validateFieldsAndScroll挑不出校驗(yàn)怀各,無法進(jìn)行提交
? ? ? ? ? ? ? ? 解決辦法:默認(rèn)值initiaValue設(shè)置為‘’倔韭, -->
? ? ? ? Table表格問題:
? ? ? ? ? 表格行復(fù)選問題;
? ? ? ? ? ? rowSelection 屬性設(shè)置表格行顯示瓢对,屬性下有 type寿酌、selectedRowKeys、onChange硕蛹、getCheckboxProps 屬性
? ? ? ? ? ? 類型為復(fù)選的情況下回顯選中問題醇疼,getCheckboxProps:(record)=>{let id = null;遍歷ids數(shù)組;return({selectedRowKeys:id})}
? ? ? ? ? 表格行其他問題:
? ? ? ? ? ? expandedRowRender 額外的展開行屬性 使用 fun(){let expandedRowRender=()=>{
? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? let columns = [...],data=[...];
? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? <Table columns={columns} dataSource={data} pagination={false}></Table>
? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? }}
? ? ? ? ? 表格分頁input填寫跳轉(zhuǎn)問題:
? ? ? ? ? ? 自帶組件填寫存在bug 可以為負(fù)數(shù)
? ? ? ? ? ? 解決:不用自帶組件法焰,直接自己寫一個(gè)
? ? ? ? DataPicker日期選擇組件問題:
? ? ? ? ? 需要聯(lián)合 moment 插件使用
? ? ? ? ? onChange 屬性選擇后 (date僵腺,dateString)moment數(shù)組和時(shí)間字符選擇顯示
? ? ? ? ? 時(shí)間格式屬性format ‘YYYY-MM-DD HH:mm:ss’
? ? ? ? Modal對話框聯(lián)合Form使用做浮動(dòng)module問題:
? ? ? ? ? 表單數(shù)據(jù)殘留問題 遮罩設(shè)置問題
? ? ? ? ? 解決:
? ? ? ? ? ? 進(jìn)入初始處理、確定清除處理壶栋、取消初始化處理
? ? ? ? ? ? mask屬性控制遮罩顯示 boolean 、maskClosable屬性控制蒙板點(diǎn)擊隱藏 boolean
? ? ? ? Upload上傳組件上傳下載問題:已有相關(guān)demo
? ? ? ? Popover氣泡卡片對齊問題:
? ? ? ? ? 問題源普监,靠近屏幕邊框朝屏幕方向?qū)R時(shí)會(huì)擠壓向下走
? ? ? ? InputNumber 組件版本更變問題
? ? ? ? ? 問題:在4.0以前的版本 InputNumber不支持blur和focus()
? ? ? ? ? 發(fā)現(xiàn)場景:在Tabel中使用blur這個(gè)api時(shí)調(diào)用方法無效
? ? ? ? ? 解決辦法:可以使用onMoseout事件和onMouseover事件代替
? ? ? ? ? 低版本中使用 <Input type='number' /> 代替 InputNumber組件然后使用Input組件Api可以避免該問題
——————————————————————————————————————————
因?yàn)橐恍┍容^少用的組件在工作中使用的少贵试,所以很多沒有整理出來,比如Pagination分頁中跳轉(zhuǎn)頁面填寫負(fù)數(shù)問題等一些開發(fā)中常見問題以后陸續(xù)更新