~~~ /** * 秒轉 時、天 以及 逆向轉換 * @param{number}v - 輸入值 * @param{h | d}param.type - h為小時,d為天 * @param{boolean}param.reverse - 是否逆向轉換 */ functiontransTime(v:number, { type='h', reverse }:any) { constinterval=type==='h'?1:24; returnreverse?v/ (3600*interval) :v*3600*interval; } 解決IE11瀏覽器不支持toString <script> if (!window.toString) { window.toString=Object.prototype.toString } </script> 下拉框帶模糊搜索功能： <Select showSearch placeholder="請選擇" optionFilterProp="children" filterOption={(input, option) => option.props.children.toLowerCase().indexOf(input.toLowerCase()) >= 0 } 年月日 moment().format('YYYYMM') moment().format("HH:mm:ss") moment().format("YYYY-MM-DD”) 單行溢出… width:300px; overflow: hidden; text-overflow:ellipsis; white-space: nowrap; InputNumber數字輸入框不能為負數，不能輸入小數點要取整數： const limitDecimals = (value: string) => { return value.replace(/^(0+)|[^\d]+/g,'') } <InputNumber min={0} formatter={limitDecimals} parser={limitDecimals} /> 單位地址：（40位） rules={[ { required:true, message:'單位地址不能為空' }, { pattern: /^.{1,40}$/, message:'單位地址不能超過40個字符' }, ]} 證件號、身份證驗證正則：（數字、18位） rules={[ { required:true, message:'證件號不能為空' }, { pattern: /^[\d]{1,18}$/i, message:'請輸入正確的證件號' } ]} 統一社會信用代碼驗證正則：（字母大小寫，18位） rules={[ {required:true, message:'統一社會信用代碼不能為空'}, {pattern: /^[\dA-z]{18}$/, message:'請輸入正確的社會統一信用代碼'} ]} 手機號碼驗證正則：（數字、10） rules={[ { required:true, message:'手機號碼不能為空' }, {pattern: /^[\d]{1,10}$/i, message:'請輸入正確的手機號碼, 僅支持數字'} ]} 手機號驗證正則： /^1\d{10}$/.test(xxx） 中文驗證正則： /^[\x00-\xff]+$/.test('xxx') 6-16為，數字、字母、字符組合至少兩種 方法: function blend(value) { return (/[a-z]/i.test(value) && (/\d/.test(value) || /\W/.test(value))) || (/\d/.test(value) && (/[a-z]/i.test(value) || /\W/.test(value))); } if判斷： if (!(blend(params.newPassword) && params.newPassword.length >= 6 && params.newPassword.length <= 16)) return message.warn('6-16位字符限制，數字、字母、字符至少包含兩種'); if (params.newPassword !== params.reNewPassword) return message.warn('兩次輸入的密碼必須保持一致'); 輸入框去掉前后空格： getValueFromEvent={event => event.target.value.trim()} 登錄，修改，忘記密碼md5加密： import { md5 } from 'shared' values.pwd = md5(values.pwd) // 其中 pwd是對應的 name 例如： <Form.Item name="pwd" rules={[{ required: true, message: '請輸入您的密碼' }]}> MD5+鹽值加密： md5(md5(password)+'hypercha1n') 或 values.password = md5(`${md5(values.password)}hypercha1n`) 表格里添加超鏈接跳轉： render: (_, record) => { return <Link to={{pathname: /dataServiceDetail/${record.resourceId}}}> {record.resourceName} } 垂直居中flex display: flex; justify-content: center; align-items: center; width: 100%; height: 100vh; 列表搜索框 const [listParams, setListParams] = useState<ListParamsTypes>({ pageSize: 10, pageNo: 1 }); onChange={onAppName} const onAppName = (e) => { listParams.keyword = e.target.value.trim(); setListParams({ ...listParams }); }; 子組件獲取父組件里的值： 在父組件里調用的子組件地方加：itemName={dataTypeModal.itemName} xxxx根據接口定義 然后再子組件調用props的地方添加：const { itemName } = props 然后在需要展示的地方 {itemName} 就可以了 獲取當前URL中的路徑部分： let detailBaseUrl = ''; const pathName = window.location.pathname; // pathname 屬性是一個可讀可寫的字符串，可設置或返回當前 URL 的路徑部分 if (pathName.includes('service')) { // includes() 方法用來判斷一個數組是否包含一個指定的值，如果是返回 true，否則false。 detailBaseUrl = '/inspect/service-supervise/org-detail/'; } else if (pathName.includes('/log/')) { detailBaseUrl = '/inspect/log/detail/'; } else if (pathName.includes('order')) { detailBaseUrl = '/inspect/order-supervise/detail/'; } 獲取地址帶home的URL constwhiteStyles = history.location.pathname.includes('home'); 把當前按鈕失去焦點： 標簽里：ref={uploadBtnRef} 組件或方法里：onClick={()=>uploadBtnRef.current.blur()} 獲取當前input文本框的值： e.target.value 獲取當前勾選框的值： e.target.checked 列如： const [formData, setFormData] = useState({}); const onSandbox = (e) => { formData.myChecked = e.target.value; setFormData({...formData}); } <Radio.Group defaultValue={0} onChange={onSandbox}> 標準 沙箱 </Radio.Group> IE11瀏覽器兼容性問題（看不到頁面+報錯：無效字符（umi.xxx.js）） 原因是：build 之后，ES6沒有編譯IE11 不識別報錯 去掉esbuild再打包 下載文件 apis.certificateDownload({verificationId:detail.evidenceId}).then((resModel:any)=>{ const {response, data} = resModel; if (data) { const fileName = response.headers.get('content-disposition').replace(/.+filename=/,''); downloadFile(data, {type: response.headers.get('content-type'), fileName }); } }) routes一級菜單，詳情高亮 // 證照制作 exportdefault [ { path:'/produced', name:'證照制作記錄', icon:'menuNotify', routes: [ { path:'/produced', name:'證照制作記錄', component:'./produced', title:'證照制作記錄', hideInMenu:true, }, { name:'證照制作記錄詳情', path:'/produced/info', component:'./produced/info', title:'證照制作記錄詳情', hideInMenu:true, }, ], }, ]; 圖表字體顏色： axisLabel: { show: true, textStyle: { color: 'red', }, }, 菜單上用JS創建一個文案點擊跳轉URL（寫死），后期改成通過接口動態獲取URL React.useEffect(() => { const oa = document.createElement('a'); oa.style.position = 'fixed'; oa.style.left = '50px'; oa.style.bottom = '20px'; oa.style.zIndex = '100'; oa.style.color = 'white'; oa.innerHTML = '區塊鏈瀏覽器'; oa.target = '_blank'; // 區塊鏈瀏覽器動態URL apis.user.query({ key: 'hypervision_url' }).then((resModel: any) => { if (resModel) { oa.href = resModel.configValue; document.body.appendChild(oa); } }); }, []); 正則去掉-（比如日歷的-） .replace(/-/, '') 圖片翻轉 transform: rotateY(180deg); Form.Item里面使用Checkbox組件選中丟失的問題在Form.Item上添加這個屬性： valuePropName="checked" 修改氣泡組件的確定取消按鈕 cancelbuttonprops={style:{display:'none'}} 添加三元條件判斷： { formData.myRadio == 1 ? : } x-render組件拖動 http://172.16.8.65:4873/-/web/detail/fr-generator 2個導航切換（包括內容） const[tabValue,setTabValue]=useState<number>(0); Js獲取頁面地址參數 var url = window.location.href; //獲取當前窗口的Url; 結果：http://localhost:61768/Home/Index?id=2&age=18 var host = window.location.host;//獲取當前窗口的主機名; 結果：localhost:61768 var port = window.location.port; //獲取當前窗口的端口; 結果：61768 var pathname = window.location.pathname;//獲取當前窗口的路徑 ; 結果：/Home/Index var URL = document.URL;//獲取當前文檔的Url；結果：http://localhost:61768/Home/Index?id=2&age=18 var search = window.location.search;//獲取參數；結果：?id=2&age=18 分割url提取參數 var search = window.location.search; var age = getSearchString('age', search); //結果：18 var id = getSearchString('id', search); //結果：2 //key(需要檢索的鍵） url（傳入的需要分割的url地址，例：?id=2&age=18） function getSearchString(key, Url) { var str = Url; str = str.substring(1, str.length); // 獲取URL中?之后的字符（去掉第一位的問號） // 以&分隔字符串，獲得類似name=xiaoli這樣的元素數組 var arr = str.split("&"); var obj = new Object(); // 將每一個數組元素以=分隔并賦給obj對象 for (var i = 0; i < arr.length; i++) { var tmp_arr = arr[i].split("="); obj[decodeURIComponent(tmp_arr[0])] = decodeURIComponent(tmp_arr[1]); } return obj[key]; } ~~~