umi+dva+antd

箭头函数

const fn_name = param = {
	return {
		name:'msg'
	}
}

		简化
    ↓↓↓↓↓↓↓↓↓↓
  
const fn_name = param = ({
		name:'msg'
	})

析构赋值

const obj = {
	key1 :'first',
	key2:'1',
	key3:'last'
}
const {key1, key2, key3} = obj
console.log(key1) //first
console.log(key2) //1
console.log(key3) //last

const obj = {
	key1 :'first',
	key2:'1',
	key3:'last'
}
const {key1, key2, ...rest} = obj
console.log(key1) //first
console.log(key2) //1
console.log(rest) //{key3:"last"} ***

react 生命周期

文件结构

- users
  - components
    + UserModel.tsx
  + index.tsx
  + model.ts
  + service.ts

文件结构 -> reducers

import { Effect, Reducer, Subscription } from 'umi';
interface UserModelType {
    namespace: 'users';
    state: {};
    reducers: {
        getList: Reducer;
    };
    effects: {};
    subscriptions: {
        setup: Subscription;
    };
}
const UserModelType = {
    namespace: 'users',
    state: {},
    reducers: {
        getList(_state: any, _action: any) {
            //action({type,payload})
            const data = [
                {
                    key: '1',
                    name: 'John Brown',
                    age: 32,
                    address: 'New York No. 1 Lake Park',
                    tags: ['nice', 'developer'],
                },
                {
                    key: '2',
                    name: 'Jim Green',
                    age: 42,
                    address: 'London No. 1 Lake Park',
                    tags: ['loser'],
                },
                {
                    key: '3',
                    name: 'Joe Black',
                    age: 32,
                    address: 'Sidney No. 1 Lake Park',
                    tags: ['cool', 'teacher'],
                },
            ];
            return data;
        },
    },
    effects: {},
    subscriptions: {
        setup({ dispatch, history }: any) {
            return history.listen(({ pathname }: any) => {
                if (pathname === '/users') {
                    dispatch({
                        type: 'getList',
                    });
                }
            });
        },
    },
};
export default UserModelType;

文件结构 -> effect

model.ts

import { Effect, Reducer, Subscription } from 'umi';
import { getRemoteList } from './service';
interface UserModelType {
    namespace: 'users';
    state: {};
    reducers: {
        getList: Reducer;
    };
    effects: {
        getRemote: Effect;
    };
    subscriptions: {
        setup: Subscription;
    };
}
const UserModelType = {
    namespace: 'users',
    state: {},
    reducers: {
        getList(_state: any, { payload }: any) {
            //action({type,payload})
            return payload;
        },
    },
    effects: {
        *getRemote({ type, payload }: any, { put, call }: any) {
            const data = yield call(getRemoteList);
            yield put({
                type: 'getList',
                payload: data,
            });
        },
    },
    subscriptions: {
        setup({ dispatch, history }: any) {
            return history.listen(({ pathname }: any) => {
                if (pathname === '/users') {
                    dispatch({
                        type: 'getRemote',
                    });
                }
            });
        },
    },
};
export default UserModelType;

service.ts

import { request } from 'umi';
export const getRemoteList = async (params: any) => {
    return request('/api/users', {
        method: 'get',
    })
        .then(function(response) {
            return response;
        })
        .catch(function(error) {
            console.log(error);
        });
};

标记文本 proxy代理

import { defineConfig } from 'umi';

export default defineConfig({
    nodeModulesTransform: {
        type: 'none',
    },
    //   routes: [
    //     { path: '/', component: '@/pages/index' },
    //   ],
    proxy: {
        '/api': {
            target: 'http://public-api-v1.aspirantzhang.com',
            changeOrigin: true,
            pathRewrite: { '^/api': '' },
        },
    },
});

//判断是否是数组
payload:Array.isArray(response)?response:[]