# Redux

在 umi 中,使用 dva 来封装了 redux;在 umi 中使用 dva 会比较简单一些, 基本上什么都不需要配置;

# 创建 model 文件

import { request, Effect, Reducer } from 'umi';


export interface UserModelState {
    username: string,
    password: string
}

export interface UserModelType {
    namespace?: 'user',
    state: UserModelState,
    effects: {
        'fetch': Effect
    },
    reducers: {
        'set': Reducer<UserModelState>
    }
}

const user: UserModelType = {
    state: {
        username: '',
        password: ''
    },
    reducers: {
        'set'(state, {payload}) {
            return payload;
        }
    },
    effects: {
        *fetch({type}, {put}) {
            console.log("Fdsfsdfsdf")
            var ret = yield request("/api/user");
            console.log(ret)
            yield put({
                type: 'set',
                payload: ret
            })
        }
    }
}

export default user;

# 引用

import { connect,  UserModelType } from 'umi';

奇怪不?为什么可以在 umi 中直接引用 UserModelType ? 在 umi 上按下 'F12',进入引用文件

// node_modules\umi\types.d.ts
export * from './lib/cjs';

// @ts-ignore
export * from '@@/core/umiExports';

然后继续探索第二个引用

// src\.umi\core\umiExports.ts
// @ts-nocheck
export { history } from './history';
export { plugin } from './plugin';
export * from '../plugin-dva/exports';
export * from '../plugin-dva/connect';
export * from '../plugin-initial-state/exports';
export * from '../plugin-model/useModel';
export * from '../plugin-request/request';
export * from '../plugin-helmet/exports';

再然后

// src\.umi\plugin-dva\connect.ts
// @ts-nocheck
import { IRoute } from '@umijs/core';
import { AnyAction } from 'redux';
import React from 'react';
import { EffectsCommandMap, SubscriptionAPI } from 'dva';
import { match } from 'react-router-dom';
import { Location, LocationState, History } from 'history';

export * from 'E:/demo/umiagain/src/models/user';

// 其他代码

怎么样,神奇吧。