la idea seria poder hacer:
{this.state.list.map((item, key) => <MyComponent {item, key} />)}
¿Qué pensarías de eso?
Me inclino a decir que no. Hemos hablado mucho sobre el uso de diferentes sintaxis y estamos tratando de mantenerlo lo más mínimo posible. Agregar {...spread}
ya era un gran problema.
cc @sebmarkbage
Tratamos de mantener las discusiones sobre sintaxis en: https://github.com/facebook/jsx De esa manera, podemos tener un grupo más amplio que contribuya a esta sintaxis para que valga la pena el peso extra para el idioma.
Creo que la diferencia entre <Foo {item} />
, <Foo {...item} />
y <Foo item />
puede ser demasiado confusa. Los dos últimos ya son compatibles.
Aunque me gusta tu forma de pensar. Si está convencido de esto, debe abrir un problema en https://github.com/facebook/jsx
https://github.com/facebook/jsx/pull/118
^ Una propuesta para la sintaxis de expresión de objeto como se analiza aquí.
Creo que la diferencia entre
, y podría ser demasiado confuso.
La confusión puede ser relativa. <Foo item />
no es muy útil ya que siempre se evalúa como {item: true}. En retrospectiva, se siente muy limitado, pero puedo entender su comportamiento a partir de sus genes html. Personalmente no le he encontrado mucho uso.
{item}
es la abreviatura de {item: item}
. {...item}
es la abreviatura de aplanar/copia superficial/difundir en un objeto nuevo.
una vez que alguien entiende que jsx transpila a h(name: string | Component, props: {[name]: any}, ...children)
. ObjectExpression cae naturalmente.
Es confuso que <Foo {x} />
no sea compatible pero <Foo {...x} />
sí lo sea. La solución es
<Foo {...{x}} />
que es mucho más confuso.