create-react-app中的注意事项

1：所有组件的中的this指的组件本身；所以window上绑定的所有属性跟方法必须用window方法调用；window不能省略（包括app.js , index.js）
2：所有的import必须放在最上面；否则会报错；报错如下：

//所有的import必须写在最上面
import 'babel-polyfill';
import React from 'react';
import ReactDOM from 'react-dom';
import './css/basic.css';
import './css/index.css';
import './css/login.css';
import App from './App';
import {$fetch} from './common/common'
console.log('===')
import registerServiceWorker from './registerServiceWorker';


//ajax封装
window.$fetch=$fetch


ReactDOM.render(<App/>, document.getElementById('root'));
registerServiceWorker();

3：fetch封装（注意formData, equest payload中时不同的处理方法）

//ajax的POST请求封装
function $fetch(arg) {

    var option = {
        url: arg.url || '',
        data: arg.data || {},
        //请求成功的回调
        callback: arg.callback || function () {
        },
        //请求错误时的处理
        errorback: arg.errorback || function () {
        },
    }
    let url=window.config.ajaxBaseUrl+option.url
    return fetch(url, {
        method: 'POST',
        dataType: 'json',
        //数据在form data
        headers: {
            'Content-Type': 'application/x-www-form-urlencoded'
        },
        body: qs.stringify(option.data)



        //数据在request payload
        // headers: {
        //
        //     'Content-Type': 'application/json'
        // },
        // body: JSON.stringify(option.data)
    }).then(function (response) {
        // console.log('response')
        // console.log(response)
        if ( !( response.status === 200)) {
            alert(response.statusText)
        }
        return response.json();
    }).then((res) => {
        // console.log('res')
        // console.log(res)
        option.callback(res)
    }).catch((err) => {
        alert(err)
    });
}

4：需要共享的数据才需要放到redux中；不需要共享的无需放到redux里面

5：组件上不能写 style=dispaly；否组不起作用