Umi: 如何自定义model模板?

Created on 10 Jan 2019  ·  6Comments  ·  Source: umijs/umi

是这样的,我们开发中,发现有些model代码可以通过模板模式来处理,很多model用一个公用的代码模板就行了,特殊的model可以通过对象merge的方式进行orverride。我们在RN中使用纯用dva我们这么处理的:

1.导出一个model list,
app,home,search,都是常规的model 对象
watterfall和listof都是通用model,里面代码完全一致,只是namespace是不一样的。(这里可能有几十个类似的文件)

const specialListOOTB = [app, home, search, loading]

const moduleListOOTB = ['waterfall', 'listof']

const specialList = _.concat(specialListOOTB, customized.specialList)
const moduleList = _.concat(moduleListOOTB, customized.moduleList)

const namespaceList = _.uniq(
  _.concat(specialList.map(it => it.namespace), moduleList)
)

const modules = namespaceList.map(it => {
  const special = _.find(specialList, { namespace: it })
  return _.merge(modelTools.createDefault(it), special)
})
console.log('initial modules', modules)
export default modules

  1. 通过modelTools.createDefault(it)来生成基础的model
...
const createDefault = namespace => ({
  namespace,
  state: {
    root: {},
  },
  effects: {},
  reducers: {
    save(state, { payload }) {
      const result = save(state, payload, namespace)
      return { ...state, ...result }
    },
  },
})

export default {
  save,
  createDefault,
}

问题是,如何将这种形式继续应用到umi中呢,我简单看了下代码,加入dva.js也不顶用。
initDva中没有预留接口。

还有一个小建议,UMI中大量是用规则大于配置,例如model.js会默认弄成model,是否考虑通过正则来处理呢,例如做一个home页面的目录结构.
image

这样的好处就是,如果我想看home的model,那么在ide里面直接输入home.model就能轻松定位,而不是输入model.js在一堆model.js中找

Most helpful comment

app.js 里这么写,

export function render(oldRender) {
  console.log(window.g_app);
  oldRender();
}

All 6 comments

@sorrycc 类似于model-extend,我们自己写了这个扩展,现在的问题是如何批量简单的注册到umi当中

这样可行?

window.g_app.model(your model);

@sorrycc 可以用,有没有合适的入口呢? 我尝试了global.js, app.js,window.g_app 都是undefined

app.js 里这么写,

export function render(oldRender) {
  console.log(window.g_app);
  oldRender();
}

Done. @sorrycc 顺便考虑一下home.page.js,home.model.js等命名规则来定义page和model?特别是model.js

Was this page helpful?
0 / 5 - 0 ratings