将可重用组件与 ReactJs 和 Flux 一起用于多个商店
Using reusable components with ReactJs and Flux with multiple stores
在我的公司，我们用 ReactJs 开始了我们的第一个项目。因为最后这可能会发展成一个大系统，所以我们决定使用 Flux 来组织事情。虽然有很多例子，但它们大多不是基于复杂系统中的使用。
我们想要实现的一件事是 UI 使用类似小部件的组件。例如，我们有一个显示客户信息的组件。此小部件将用在带有发票信息的标签页上，但也会用在同一浏览器中带有客户卡的另一个标签页上 window。并且还会有一些其他组件将使用此小部件。
所以我有一个 React 组件，它应该监听商店的更改事件。然而，这个组件本身并不知道要听哪个商店，因为我可以有一个发票商店，还有另一个应该显示客户信息的商店。
我发现 this 问题提供了一些有关如何创建可重用组件的信息，但没有提供有关如何使用具有多个商店的组件的一些提示。
我考虑的一件事是将要用作参数的商店传递到可重用组件中。这是明智之举吗？
提前感谢您的反应！
一种方法是在父组件中处理所有数据检索逻辑。在那个模型中，你的 CustomerCard 组件不需要知道如何检索它的数据，而是期望它作为 props 传递。这是可重用性的胜利，因为您的 CustomerCard 组件不再与特定的数据检索过程相关联。
在您的情况下，您可以为每个商店创建一个容器组件，并且每个商店都将在其 render() 方法中 return 一个 <CustomerCard customerInfo={...} /> 元素。
在我的公司，我们用 ReactJs 开始了我们的第一个项目。因为最后这可能会发展成一个大系统，所以我们决定使用 Flux 来组织事情。虽然有很多例子，但它们大多不是基于复杂系统中的使用。
我们想要实现的一件事是 UI 使用类似小部件的组件。例如，我们有一个显示客户信息的组件。此小部件将用在带有发票信息的标签页上，但也会用在同一浏览器中带有客户卡的另一个标签页上 window。并且还会有一些其他组件将使用此小部件。
所以我有一个 React 组件，它应该监听商店的更改事件。然而，这个组件本身并不知道要听哪个商店，因为我可以有一个发票商店，还有另一个应该显示客户信息的商店。
我发现 this 问题提供了一些有关如何创建可重用组件的信息，但没有提供有关如何使用具有多个商店的组件的一些提示。
我考虑的一件事是将要用作参数的商店传递到可重用组件中。这是明智之举吗？
提前感谢您的反应！
一种方法是在父组件中处理所有数据检索逻辑。在那个模型中，你的 CustomerCard 组件不需要知道如何检索它的数据，而是期望它作为 props 传递。这是可重用性的胜利，因为您的 CustomerCard 组件不再与特定的数据检索过程相关联。
在您的情况下，您可以为每个商店创建一个容器组件，并且每个商店都将在其 render() 方法中 return 一个 <CustomerCard customerInfo={...} /> 元素。