user页面会重复渲染

[zhangxiaoj]

No description provided.

[fkpwolf]

仔细看了下，User 列表页面会渲染三次：

1. model 初始化的时候加载一次，合理。
2. effects 中的 const { data, headers } = yield call(usersService.fetch, { page }); 这一句会触发渲染。似乎没有必要，因为数据虽然取了回来，但是还没有塞到 model 中。
3. reduce 中的 save 修改 model 后会触发一次，合理。

effect 应该是只能读取 state 而不能修改 state，要修改数据，只能在 reduce 中修改。这样 effect 里面的代码应该不会导致页面刷新啊？

[fkpwolf]

找到原因了，第二次是由于Step 8. 通过 dva-loading 处理 loading 状态导致的，loading 状态是另外一个 model了，而fetch会修改这个状态。
由于 React 的机制，在数据没有变化的情况下组件是不会重新加载的，这样只是一个 loading 的变化对整个页面的性能影响关系不大。

[allinshang]

不能只渲染一次么？

[fkpwolf]

@allinshang 这里的做法是先显示空白数据页面，然后取到数据后再次渲染，这样用户体验会好点。当然你也可以先准备好数据，然后再跳转到这个页面。