Question

我是React的新手，我不知道最好的方法是什么。

我有一个汽车列表，点击每一行它应该显示该汽车的整页详情。

我的代码结构是：

我有App呈现两个组件。 CarList和CarDetails。最初隐藏汽车详细信息。我在应用程序中渲染carDetails的原因是因为它是一个庞大的修复模板，因此我想在加载应用程序时渲染一次，并且只在每行单击时更新它的数据。

CarList还渲染CarRow组件，这很好。现在我的问题是我在CarRow组件上有一个getDetails函数，它正在调用以获取基于car id的详细信息。如何更新carDetails组件数据？我用了 this.setState（{itemDetails：数据}）; 但似乎carRow的状态与carDetails中的状态不同。

有任何帮助吗？

Answer 1

这是一个基本问题，为了尝试和解决，已经进行了大量的思考和工时。在StackOverflow帖子中，除了表面级别之外，它可能无法得到解答。它也不是以React为中心的。无论您使用哪种框架，这都是大多数应用程序的问题。

由于您在React的上下文中提到过，您可能会考虑阅读flux，这是与React一致的这种单向数据流理念的事实上的实现。但是，这种架构绝不是最好的＃34;像其他一切一样，它有其优点和缺点。

有些人不喜欢全球＆＃34;事件总线＆＃34;通量建议。如果是这种情况，您可以简单地实现自己的中间数据层API来收集查询回调，A）调用任何调用保存数据的回调，B）刷新任何适当的查询到服务器。但是现在，我仍然坚持使用助焊剂，因为它可以让你了解大多数人认为是好的东西所涉及的一般原则，就像一个单一的真理来源对于您的数据，单向流程等。

举一个回调理念的具体例子：

using System;

public class DoStuff
{
    public static void ShowVariable()
    {
        var type = typeof(Program); //get type of Program
        //get the field, which is static and private
        var field = type.GetField("myString", System.Reflection.BindingFlags.Static | System.Reflection.BindingFlags.NonPublic);
        var val = field.GetValue(null); //field value, null - as the field doesn't belong to an instance

        Console.WriteLine(val);
    }
}

这是一个非常精简的示例，并没有解决优化问题，例如在移动到不同视图和调用“＃stale”时会出现内存泄漏的可能性。回调，但它应该让你大致了解另一种方法。

这两种方法具有相同的策略（数据和单向数据流的单一事实来源）但不同的实现（全局＆＃34;事件总线＆＃34;这需要跟踪事件，或简单的回调方法，这可能需要一种形式的记忆管理。）

在React中更新两个组件之间的数据

1 个答案: