reactjs - 从我的 JSX 中获取一些 {({})()(}

Question

所以我正在学习 React，并且正在努力真正清楚地了解所有 { ( } ) 在 JSX 中到底在做什么、在哪里、为什么以及如何做。

所以我最终在这里生成了这段代码:

            <Connect query={ graphqlOperation(ListEvents) }>
                { ( { data: { listEvents } } ) =>
                    <div> {
                    listEvents ? (
                        <ListView events={listEvents.items}/>
                        ) : (
                        <h3> Loading </h3>
                    )} </div>
                }
            </Connect>

我希望有什么可以为我做的是，重写它的不同方法是什么？希望更干净？更简洁？更少 (){}？

我尝试过几种不同的方式重写，但最终还是破坏了它。

有办法吗？

Answer 1

所以，这里你传递了一些对象，比如x，其中包含一个名为“data”的对象。在data对象中，你有一个名为listEvents<的键.

您正在使用 ES6 中引入的扩展运算符获取关键的 listEvents，它不是 JSX。

此外，您正在检查名为 listEvents 的键是否有值。如果该值存在，则传递该值，否则显示 spinner在 JSX 中使用三元运算符。

如果您可以分享您想要实现相同目标的地方，我可以提供帮助。