Ant Design Pro 開發記錄

Ant Design Pro 是一款適用於中後臺的前端框架，基於React, dva.js, Ant Design。

關於路由的問題（UMI版本將不涉及此問題）

在 src/common/router.js 中， 配置路徑如下：

1. /A
2. /A/B
3. /A/C

那麼 2 和 3 是訪問不到的，這裏引用官方的解決方案

關於dva.js的使用

儘可能的將所有處理數據交互的操作都放在 src/models 中，方便管理，同時也可以將業務邏輯有效的分離出來

業務場景：

通過modal提交表單，POST成功之後需要有一個回調函數來關閉modal

---

model file (*.js)

*fetch({ payload, callback }, { call, put }) {
    // request here
    if (callback) callback() // ** 回調函數 **
})

page file (*.js)

this.props.dispatch({
    type: '***',
    payload: '***',
    callback: () => {
        // callback function
    }
})

一個頁面，多個表單的處理

const CreateForm = Form.create()((props) => {
  const { form, onSubmit, } = props;
  const handleAdd = (e) => {
    e.preventDefault();
    form.validateFields((err, fieldsValue) => {
      if (err) return;
      onSubmit(fieldsValue);
    });
  };
  return (
    // form item
  );
});

// 省略
return (
    <CreateForm onSubmit={this.handleSubmit} />
)