我在哪里将CRUD操作放在reactjs应用程序中?

时间:2017-12-17 12:28:06

标签: reactjs crud idiomatic

网上到处都是人们告诉我,我做错了。我确定他们是对的,因为我刚刚开始。一个常见的说法是反应就是视图层。这太棒了,但它让我想知道我把其他东西放在哪里?

我有一组相当简单的组件,它们一起显示嵌套数据类型的列表,并允许对事物进行一些编辑,创建和删除。使用数据的组件通过从提取数据的父级的层次结构传递到的元素。如果只是视图层"

最佳做法是什么,惯用方式,反应方式?我的删除操作是否应包含在删除按钮组件中?读操作旁边?在其他地方?

2 个答案:

答案 0 :(得分:0)

在反应中,数据仅从父组件流向子组件。我假设您的状态存储在父组件中,因为您在单独的组件中创建,更新和删除。只能通过调用setState()函数来更改状态。因此子组件无法修改应用程序的状态。这只能通过具有回调函数来完成。

delete函数将写入父组件,并作为prop传递给delete组件。然后删除组件将调用delete函数(回调),该函数将调用父组件状态的setState(),从而改变状态。如果没有setState(),切勿改变应用程序的状态。

希望这有帮助

答案 1 :(得分:0)

我建议你尝试一些助焊剂架构。在这种情况下,它看起来类似于下面描述的:

  • 您可以在删除按钮单击时调用操作,例如actions.deleteUser(1)
  • 操作调用适当的API
  • 存储已连接到您的组件更改和组件状态更改
  • 组件自动重新呈现

这取决于你喜欢的Flux。流程可能略有不同。我更喜欢反流一次