还是关于组件拆分的问题

Question

dva 中，通常需要 connect Model的组件都是 Route Components，组织在/routes/目录下，而/components/目录下则是纯组件（Presentational Components）。

这是 dva 官网给的建议，我理解就是 容器组件大多都是路由组件，放在 routers 文件夹下，而 UI 组件放在 components 下。这样就有几个问题。

1. 会存在 容器组件 不是路由组件的情况，比如弹窗这种，可能多个页面都需要有弹窗，弹窗里有列表，选择某个列表的信息，这个弹窗肯定是需要每次都发送请求获取数据的（保证每次弹出 page在第一页 search条件清空，且数据是最新的，这样不能用 redux 存储的数据），那这个弹窗组件其实也是有数据请求的，但它不是一个路由组件，这种情况，这个弹窗放在哪里合适，我觉得它更像个公共容器组件。

2. 关于 redux 使用，我理解是一些像搜索条件，翻页信息这种，在访问详情页返回列表页，为了保证列表页数据一致，需要使用 redux ，但一些不需要保留状态的，是不是放在页面自己的 state 里就好了，有必要都放在 redux 里吗？如果不需要房子 redux 里，发送请求用 redux 中间件好（中间件请求结束后调用 page 页面 callback，不调用 reducer，这样 page 页面更干净，数据请求都在 redux 中间件层，一致），还是直接在 page页面 里调用 server 层的接口请求？

3. 一个管理系统，UI组件是很多的，都放在 components 下会很多很多，我更想把和某个容器组件相关的 UI组件 放在该容器组件的文件夹下，把公共组件（公共容器组件或者公共UI组件）提出来放在components 下，这样会不会更合理 ？

Answer 1

Dell 2019-11-14 23:56:26

1. 这个组件可以认为是一个公共容器组件没问题，在外层建一个components目录下管理

2. 建议都放在redux中，方便管理。放在redux中间层里。

3. 是的，这样很合理。
   

• 提问者 诺巴蒂 #1

  问题2：
  那这样还会有一个问题，对于一些弹窗类获取数据的容器组件，在不同的地方弹窗弹出时，数据都应该时默认没有搜索条件，pageNo 是1，如果用 redux 了，我反而需要每次还需要重置搜索条件。
  请求放在 redux 中间层我可以理解，保证接口位置的一致性

• Dell 回复 提问者 诺巴蒂 #2

  通用组件，共用组件的数据，不需要放在redux，可以单独管理

• 提问者 诺巴蒂 回复 Dell #3

  好的，谢谢李老师?