React: ide: mendukung singkatan nilai properti objek literal dalam sintaks jsx

Dibuat pada 16 Nov 2014  ·  3Komentar  ·  Sumber: facebook/react

idenya adalah dapat melakukan:

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

apa yang akan Anda pikirkan?

Semua 3 komentar

Saya cenderung untuk mengatakan tidak. Kami telah berbicara banyak tentang penggunaan sintaks yang berbeda dan kami mencoba untuk membuatnya seminimal mungkin. Menambahkan {...spread} sudah menjadi masalah yang cukup besar.

cc @sebmarkbage

Kami mencoba untuk melanjutkan diskusi sintaksis di: https://github.com/facebook/jsx Dengan cara itu kami dapat memiliki grup yang lebih luas yang berkontribusi pada sintaks ini untuk menjadikannya bobot ekstra untuk bahasa.

Saya pikir perbedaan antara <Foo {item} /> , <Foo {...item} /> dan <Foo item /> mungkin terlalu membingungkan. Dua yang terakhir sudah didukung.

Aku suka caramu berpikir. Jika Anda merasa kuat tentang ini, Anda harus membuka masalah di https://github.com/facebook/jsx

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

^ Proposal untuk sintaks ekspresi objek seperti yang dibahas di sini.

Saya pikir perbedaan antara , dan mungkin terlalu membingungkan.

Kebingungan mungkin relatif. <Foo item /> tidak terlalu berguna karena selalu bernilai {item: true}. Kalau dipikir-pikir rasanya sangat terbatas, tetapi saya dapat memahami perilakunya dari gen htmlnya. Saya pribadi belum menemukan banyak kegunaan untuk itu.

dan tidak membingungkan jika Anda melihatnya dari perspektif notasi objek ES8. {item} adalah singkatan dari {item: item} . {...item} adalah kependekan dari flatten/shallow copy/ spread ke objek baru.

setelah seseorang memahami bahwa jsx berubah menjadi h(name: string | Component, props: {[name]: any}, ...children) . ObjectExpression jatuh secara alami.

Membingungkan bahwa <Foo {x} /> tidak didukung tetapi <Foo {...x} /> didukung. Solusinya adalah
<Foo {...{x}} /> yang jauh lebih membingungkan.

Apakah halaman ini membantu?
0 / 5 - 0 peringkat