我们目前正在为我们公司开发一个新的网络地图解决方案.到目前为止,我们决定使用React
和构建应用程序OpenLayers 4
.由于我们希望将Redux
模式用于我们的体系结构,因此将有一个redux存储保存应用程序状态.
我们在这个堆栈中遇到的问题如下:
map是我们应用程序中的中心元素,它的实例需要传递给许多不同的组件.例如,用于在地图上绘制要素的工具需要对map
实例的引用,以便它可以将其自身添加为交互工具.
我们讨论了如何构建我们的应用程序以最可靠的方式集成OpenLayers
,React
最终得到两种不同的方法:
我们讨论的第一种方法是在应用程序范围的redux存储中保存对map对象的引用,这样它就可以通过@connect
注释函数传递给任何组件react-redux
.虽然这个解决方案提供了一个简单的访问,map
我们想知道这是否是一个易处理的方法,因为存储应保持最小,并且map
对象永远不会在应用程序的整个生命周期中发生变化.
第二种方法将渲染组件(如上面提到的绘制交互)视为反应图组件的子组件.map
然后,可以直接将实例作为a prop
或通过利用模式利用反应context
对象传递给地图组件的子项Provider
.
但是,反应文档明确建议不要使用context
,尽管我们发现了许多使用这种模式的解决方案(react-geo,react-leaflet)以及流行的库,比如react-redux
使用它.
因此,我们考虑使用React.Children.map()
克隆子组件,然后将map
其添加为prop
.
我希望我们面临的问题足够清楚.我们不知道在react
最佳实践方面哪种方式更好.
什么架构更适合设计/管理和应用的"反应方式"?为什么?