原创 file-saver庫保存axios返回的表格文件亂碼

因爲a標籤下載文件不好在header裏帶鑑權token,所以用的file-saver來保存下載的文件,先把接收到的數據轉爲Blob對象,type可參考常見 MIME 類型列表: import { saveAs } from 'file-sa

原创 利用Prompt,阻止react路由切換,彈窗確認,並且自定義彈窗樣式

在做項目的時候,有個需求,當表單頁面未保存,切到其他頁面時需要用戶確認跳轉。 按常理來說,跳轉是由react-router-dom控制的,所以它也應該有阻止跳轉的機制,查了api,發現Prompt這個組件可以做到這個事。將Prompt放在需

原创 taro的坑:子組件的默認屬性和父組件中修改子組件樣式問題以及應用複雜數據

坑一:子組件的默認屬性 如果這樣獲取可選屬性的默認值: const { startScore = 0, currentScore = 0, endScore = 0, showStartAndEnd = true } = this.

原创 react用子組件(有RouteComponentProps)報錯:'match' is missing in type ''

因爲子組件有RouteComponentProps,所以在父組件中引用需要傳相應的屬性。但考慮到如果層級較深的話一層一層傳就很麻煩。而如果我們用route組件引用的話就會很簡單,只需要在需要子組件的地方用route的render屬性就可以了

原创 解決antd-mobile樣式被postcss轉換的問題

思路是在webpack裏postcss-loader不對庫的文件起作用。經過嘗試配置如下: { test: /\.(css|less)$/,

原创 js安全取出對象中的某個屬性

如圖所示,在我們獲取對象一個深層的屬性時,必須保證它的上一級不爲undefined,爲了不讓程序崩潰,通常我們這樣寫: 但這樣十分麻煩,而且如果你從接口拿到一個對象,使用對象的每個屬性時都要寫一堆,十分醜陋。而如果用解構的方式,就會優雅

原创 react寫一個select組件

之前一直用的antd的Select組件,但在有些端並不適用,而原生的select樣式修改不靈活,遂產生自己寫一個組件的想法。觀察select組件: <select onChange={(value) => {this.value=value

原创 圖片自適應

之前一直用background-size屬性滿足圖片自適應,但今天發現這樣不能在網頁上下載,就去找了下img標籤能不能實現類似的效果,結果找到了object-fit屬性,完全能滿足需求。

原创 在一個元素上:hover,改變另一個元素的css屬性

如果二者是父子關係,可以寫成這種: .face:hover .eye-bottom { margin-top: 30px; } 如果是兄弟關係: .face:hov

原创 antd form表單一行多個組件並對其校驗

一行一個標籤對應多個輸入組件,這個需求很常見但在官方例子沒看到合適的,因爲官方建議: 注意:一個 Form.Item 建議只放一個被 getFieldDecorator 裝飾過的 child,當有多個被裝飾過的 child 時,help r

原创 antd form表單初始化無效的問題

至今爲止踩過三個坑: 1.不能用組件本身的defaultValue,而是應該用initialValue,如圖 2.初始值對應的是組件的value,例如select組件的初始值應該是option的value屬性值,是圖中的data.key,而