Refactor Popup / ActionSheet / Modal

[paranoidjk]

问题

#1121
#635

 Popup.show(
   <Foo bar={this.state.bar}>,
  { animationType: 'slide-up', maskProps, maskClosable: true, onMaskClose: maskClose }
);

Popup / ActionSheet / Modal 渲染完成后无法通过修改 props 触发 rerender 的问题。

原因

Popup / ActionSheet / Modal 这三个组件的 API 都是 Popup.show(content)的形式，content 被 render 在单独创建的 div 里，导致渲染完成后，外部无法修改 content 的 props 触发 rerender。

解决方案:

Api 改成如下形式

<Popup>
  {content}
</Popup>

[afc163]

应该是添加而不是修改。

[paranoidjk]

#1121 里的问题抽象来看就是，Popup渲染完成之后，content无法响应 dva store (修改props) 来 rerender，具体如下

• Popup 的 content 里有个 button
• button click 是会触发异步请求的，所以 button 有 loading 以及 request result 返回的不同状态
• 而整个应用是基于 dva，button 是 dispatch action, 修改store

[paranoidjk]

cc @benjycui @yesmeck 你们今天讨论的就是这个，有兴趣的来改一发

[silentcloud]

@paranoidjk 不要修改，要把 component 抽出来，类似 RN modal actionsheet toast 那样，index 提供 api，另外提供一个纯 component 的

[paranoidjk]

@yesmeck 之前说的重复 render 是可行的。

https://facebook.github.io/react/docs/react-dom.html#render

If the React element was previously rendered into container, this will perform an update on it and only mutate the DOM as necessary to reflect the latest React element.