React学习记录

2018/12/24

按需引入antd的时候遇到的问题
1 .babelrc配置

  "plugins": [
    ["import", {
      "libraryName": "antd",
//      "libraryDirectory": "es",
      "style": "css" // `style: true` 会加载 less 文件
    }]
  ]

2.之前跟着别人写的webpack没有指定css的规则，导致一直报错

    {
        test: /\.css$/,
        use: ['style-loader', 'css-loader'],
    },
    //style-loader也是必须的

3.正确引用antd之后命令行工具那里会一直有警告说文件太大，要控制大小，如下

WARNING in webpack performance recommendations: 
You can limit the size of your bundles by using import() or require.ensure to lazy load some parts of your application.
For more info visit https://webpack.js.org/guides/code-splitting/

2018/12/25

1.jsx语法给元素设置内联样式：双花括号，样式名字要驼峰，值是字符串；

<button  style={{marginTop:'40px'}}>提交</button>

2.redux的基础用法：
建议是另起一个文件夹，专门放store的文件;
store文件夹里面新建一个index.js；需要做3件事件；
新建一个createStore实例，这个实例需要从reducers.js引进的，输出这个实例

import {createStore} from 'redux';
import reducers from 'reducers'
const Store=createStore(reducers);
export default Store;

store文件夹里面新建一个reducers.js；

const defaultStore={};
export default (State=defaultStore,action)=>{
    return State;
}

2018/12/29

1.this.setState的不同写法的区别

this.setState(() => ({

 }))
this.setState({
                       
})