React: アイデア:jsx構文でオブジェクトリテラルプロパティ値の省略形をサポートする

作成日 2014年11月16日  ·  3コメント  ·  ソース: facebook/react

アイデアはできることです:

{this.state.list.map((item, key) => <MyComponent {item, key} />)}

あなたはそれについてどう思いますか?

全てのコメント3件

私はノーと言いたがります。 さまざまな構文を使用することについて多くのことを話しましたが、可能な限り最小限に抑えるようにしています。 {...spread}を追加することは、すでにかなり大きな問題でした。

cc @sebmarkbage

https://github.com/facebook/jsxで構文の議論を続けようとしています。こうすることで、この構文に貢献する幅広いグループを作成して、言語に余分な重みを与える価値を持たせることができます。

<Foo {item} /><Foo {...item} /><Foo item />の違いはわかりにくいかもしれません。 最後の2つはすでにサポートされています。

私はあなたの考え方が好きです。 これについて強く感じている場合は、 https://github.com/facebook/jsxで問題を開く必要があります

https://github.com/facebook/jsx/pull/118

^ここで説明するオブジェクト式構文の提案。

の違いは混乱しすぎるかもしれません。

混乱は相対的なものかもしれません。 <Foo item />は、常に{item:true}と評価されるため、あまり役に立ちません。 後から考えると、非常に制限されているように感じますが、html遺伝子からその動作を理解できます。 個人的にはあまり使い道がありません。

ES8オブジェクト表記の観点から見れば、混乱することはありません。 {item}{item: item}の省略形です。 {...item}は、新しいオブジェクトへのフラット化/浅いコピー/拡散の省略形です。

誰かがjsxがh(name: string | Component, props: {[name]: any}, ...children)にトランスパイルすることを理解したら。 ObjectExpressionは自然に分類されます。

<Foo {x} />がサポートされていないのに、 <Foo {...x} />はサポートされているのは紛らわしいです。 回避策は
<Foo {...{x}} />これはもっと混乱します。

このページは役に立ちましたか?
0 / 5 - 0 評価