1.控制反轉（Inversion of Control）是一種「思想」，依賴注入（Dependency Injection）則是這一思想的一種具體「實現方式」
2.react 要注意全局 id相同
3.Component series.scatter not exists. Load it first. 是echart的引入問題，另外，dom 必須要指定 style={{ width: 400, height: 400 }}
4.因為框架總是會引入很多概念，框架文檔，應該是最好的概念說明書
5.loading可以細化到每個model里的effect，比如order model里有三個effect，分別是fetchOrder, fetchOrderTran, fetchOrderOps分別對應A,B,C區域。loading對應可以為loading.effects['order/fetchOrder'],loading.effects['order/fetchOrderTran'],loading.effects['order/fetchOrderOps']。這樣就互相不影響了。
https://segmentfault.com/q/1010000015441990
4.react適合構建那些業務系統，如 倉庫信息管理系統，而Vue構建公司官網，或者其他一切比較近前端的應用能適合
5.從connect出發找不到loading的出處，原來是在依賴里，loading是dva的插件，因為這個的文檔不錯，因此最好去dva官網看源碼解析的內容，對理解dva和loading有很大幫助
@connect(({ list, loading }) => ({
list,
loading: loading.models.list,
}))
這里是用一個處理函數，return一個組裝后的對象作為connect的參數傳入
用法：
export default connect(從 model 的 state 中獲取數據)(要將數據綁定到哪個組件)
6.有位技術大牛曾經告訴過我：看源碼之前，先去看 package.json 。看看項目的入口文件，翻翻它用了哪些依賴，對項目便有了大致的概念
7.改變共享數據的唯一辦法就是顯示地改變它，Vuex和Redux的思想都是這樣
8.語法：
const TTable = ({
...tableProps,
}) => { }
這里通常是把一些零散的屬性通過結構賦值，合在一起，賦值到 tableProps
9.React的組件里，若組裝對象需要引用到一個方法，這個方法必須是已定義的，否則會出現迷之錯誤
10.promise的思想是說：把一句異步變成一段異步，這一段一定得是一段獨立邏輯，不會影響其他的，否則也要把相關其他的引進來
11.antd對數據檢測很強，key label一定不能重復，value也要注意，特別是option的
12.jsx可以連續用多個｛｝，分開來寫語句更清晰
13.routerRedux.push() 是dva提供的路由跳轉的方法
14.[mapStateToProps(state, [ownProps]): stateProps] []表示可有可無？ 這里的:表示返回值嗎？？？
15.語法
let jsonData = { id: 42, status: "OK", data: [867, 5309] }; let { id, status, data: number } = jsonData; console.log(id, status, number); // 42, "OK", [867, 5309]
let arr = [1, 2, 3]; let {0 : first, [arr.length - 1] : last} = arr; first // 1 last // 3
16.微服務就是專心做好一件事
17.做單頁面應用時，為了達到和頁面同步，不多次請求數據，那么一次性請求大量數據，再利用filter,map,find,來操作數據，不再麻煩后端
18.點擊導航選項的時候，讓對應內容填充的到頁面，實現這種效果的方式就是路由
19.this.setState()方法，這個方法有一個特點，就是每次執行以后，它會自動調用render方法，導致 UI 更新
20.有些框架文檔啰幾把嗦，講不到點子上
21.如何解決，flex交叉軸居中時，有的item看起來仍然不居中，答案是用relative+absolute的方案，在原有位置使用absolute偏移一些位置，使得視覺上居中，這種不居中通常出現在（封裝好的）組件使用上
22.微服務難在如何把核心數據概念定出來，其他數據都是可以從核心數據轉化而來的
23.微服務就是方便迭代
24.使用正則，對於已被使用的符號，直接前面加 \ \[([\u4e00-\u9fa5]{1,3})\] ，這個正則可以匹配 [呵呵] 或者 [呵呵峰]
25.@ 這個符號代表src 目錄 ，由webpack去配置，是一個路徑別名
https://www.cnblogs.com/boshow/p/8758927.html
resolve: { // 自動補全的擴展名 extensions: ['.js', '.vue', '.json'], // 默認路徑代理 // 例如 import Vue from 'vue'，會自動到 'vue/dist/vue.common.js'中尋找 alias: { '@': resolve('src'), '@config': resolve('config'), 'vue$': 'vue/dist/vue.common.js' } }
26.在React或Ant D Pro里如何引入大量圖片
https://blog.csdn.net/zhengjie0722/article/details/78862938
例如：
//批量導入gif const requireContext = require.context("@/assets/arclist", true, /^\.\/.*\.gif$/); const projectImgs = strSort(requireContext.keys()).map(requireContext)
導入文件列表的順序，按照文件名來排，1開頭的永遠比2開頭的要前，哪怕你是112.gif和2.gif，通常ui給圖，都按照數字順序來，所以這里 我用了一個排序函數
function strSort(arr) { //將文件名進行排序 var stu = arr stu.sort(function (a, b) { if (a.length == b.length) { return b.localeCompare(a); } else { return b.length - a.length; } }) return stu.reverse() }
序列1 111 112 2 變為 1 2 111 1112
27. put不成功，請檢查你的參數
28. effects 出問題是不會提示的
29. 關於payload（有效載荷）的理解，https://www.jianshu.com/p/1bf3456a396a
例如，后端返回的json包含數據請求狀態status和錯誤碼error(code)還有請求的數據data，那么data就是payload，就是一段數據中的精華部分
30. 微服務https://www.cnblogs.com/imyalost/p/6792724.html
31.
<Row type='flex' justify='space-between'>
<Col span={6}>訂單號：144545451151515</Col>
<Col span={6}>申請賬號：safasdfadf2123</Col>
<Col span={6}>賬號密碼：safasdfadf2123</Col>
</Row>
32. antd改動路由配置要重啟，否則出現部分樣式問題
33. 組件路徑名區分大小寫
34. npm install時，不save，就會導致只有本機有這個依賴可用，其他有無pkg沒有，所以就沒裝，沒得用
35. https://blog.csdn.net/alex_my/article/details/78134314 更新pkg，依賴， https://segmentfault.com/q/1010000010819130
36.
{getFieldDecorator('GroupType', {
initialValue: ''
})(
<Select style={{ width: '100%' }} placeholder='請輸入賬號'>
<Select.Option value='1'>選項1</Select.Option>
<Select.Option value='2'>選項2</Select.Option>
</Select>
)}
getFieldDecorator select若設置 initialValue: ''不對，將導致placeholder不可用
37. import xxx from @ @表示根目錄，實際上由打包工具配置的，不是ES6語法的部分
38.
<Row type='flex' align='middle' > <Col span={2}> <span>序號 </span> {getFieldDecorator('GroupType', { initialValue: '' })( <Input disabled style={{ width: '50px' }} /> )} </Col> <Col span={18}> <Row type='flex' justify='space-between'> <Col >名稱 </Col> <Col className={styles.marginRight}> {getFieldDecorator('GroupType', { initialValue: '' })( <Input /> )} </Col> <Col >時間 </Col> <Col className={styles.marginRight}> <DatePicker.RangePicker defaultValue={[moment('2015/01/01', dateFormat), moment('2015/01/01', dateFormat)]} format={dateFormat} onChange={onChange} onOk={onOk} /> </Col> <Col >參與人 </Col> <Col className={styles.marginRight}> {getFieldDecorator('GroupType', { valuePropName: 'defaultValue', initialValue: ['1'], })( <Select style={{ width: 300 }} mode="multiple" placeholder="請選擇參與人" > <Select.Option value='1'>選項1</Select.Option> <Select.Option value='2'>選項2</Select.Option> </Select> )} </Col> <Col ><Icon type="minus-circle" style={{ fontSize: '24px' }} /> </Col> </Row> </Col> </Row>
<Row className={commonStyles.commonMarginTop}> <Col offset={2} span={18}> <Row type='flex' justify='space-between'> <span>備注 </span> <Input.TextArea style={{ maxWidth: '95%' }} autosize={{ minRows: 5, maxRows: 10 }} /> </Row> </Col> </Row>
flex 的 space-between是最好用 的，特別是多項同行排列，並且左右要求頂格的情況
39.添加新頁面（通常為將已有頁面復制一份，進行改動，作為新頁面），頁面載入（已有）樣式不對時，刷新也不管用，此時不用重啟，直接注釋掉router.config.js對應的路由配置再恢復，則框架會重新載入，然后發現頁面和樣式均載入正常。
40.組件命名有無狀態，是不是說，Index.jsx是無狀態，User.jsx是有狀態？
41.如果層級不深，超過3層，就通過props來傳遞狀態（說白了，就是model維護的值），超過3層，就要用dva的connect能力，在第四層connect model的數據，因為只用props，會導致中間幾層傳遞無用的數據，維護起來太痛苦，例如我變量改個名，要改n個文件，一旦有一個遺漏，數據就拿不到，一般兩層到三層之間的話，你一對多，跟一對一的。復雜度其實差不多的，還不如你一對一，然后一再對一對一對一這樣子進行。
42. line-hieght 是個好東西，學了flex，別忘了flex和line-hieght，float和margin配合使用
43. 改變共享數據的唯一辦法就是顯示地改變它，Vuex和Redux都是符合這個思想
44.框架文檔，應該是最好的概念說明書，因為框架總是會引入很多概念
45.Objects are not valid as a React child 錯誤處理 https://blog.csdn.net/isaisai/article/details/78083677
46.匹配微信表情 編碼/ \[([\u4e00-\u9fa5]{1,3})\]/g
47.effect 的 put不成功，請檢查你的參數
48.如何開發不遺漏，就是按照數據流經的地方來做，從起點到終點
49.IaaS，PaaS，SaaS 的區別與理解 http://www.ruanyifeng.com/blog/2017/07/iaas-paas-saas.html
50.把公共類抽離出來，用得時候，直接用，使得全局統一，不必常翻看頁面看看有沒對齊