component同redux关联

在umi中创建的model文件会自动被读取

绑定

BaseSetting.jsx

import {
    Form,
} from 'antd';
import React, { useState, useEffect } from 'react';
import { connect } from 'dva';
const BaseSetting = props => {
    console.log(props, "--------")
    return (
        <div>
            <h1>hello</h1>
        </div>
    );
};
export default connect(({ settingAndAccountSetting }) => ({
    data: settingAndAccountSetting.current,
}))(Form.create()(BaseSetting));

通过引入connect会自动与model中的文件绑定

修改model数据

dispatch派发用active触发reducer去修改
BaseSetting.jsx

import {
    Form,
    Button
} from 'antd';
import React, { useState, useEffect } from 'react';
import { connect } from 'dva';


const BaseSetting = props => {
    const { dispatch, data } = props
    console.log(props, data, "----")

    const changeData = () => {
        if (!dispatch) return
        dispatch(
            {
                type: 'settingAndAccountSetting/changeCurrentData',
                payload: "高级设置"
            }
        )
    }

    return (
        <div>
            <h1>{data}</h1>
            <Button onClick={changeData}>btn</Button>
        </div>
    );
};


export default connect(({ settingAndAccountSetting }) => ({
    data: settingAndAccountSetting.current,
}))(BaseSetting);

model.js

import { fakeSubmitForm } from './service';

const Model = {
  namespace: 'settingAndAccountSetting',
  state: {
    current: '基本设置',
  },
  effects: {

  },
  reducers: {
    changeCurrentData(state, { payload }) {
      return { ...state, current: payload };
    },
  },
};
export default Model;