Storybook: Menentukan propTable masih membuat dua dokumen prop

Dibuat pada 22 Apr 2017 · 3Komentar · Sumber: storybookjs/storybook

Diterbitkan oleh
_Rabu 24 Agustus 2016 pukul 06:49 GMT_
_Awalnya dibuka sebagai https://github.com/storybooks/react-storybook-addon-info/issues/59_

Saat ini saya mengekspor komponen bersama dengan versi yang dibungkus ( default export) sehingga saya dapat mendokumentasikan komponen secara terpisah, karena default yang dibungkus dengan beberapa fungsi tingkat tinggi lainnya tidak 't memberikan referensi ke propTypes untuk buku cerita reaksi untuk digunakan.

Sebagai contoh:

export class SampleComponent extends Component {

}

export default compose(...)(SampleComponent);

Saya menggunakan impor { SampleComponent } untuk tujuan dokumentasi, namun, saya mendapatkan dua UI yang dirender untuk propTables .

"SampleComponent" Component
property    propType    required    default
contextStyles   object  no  {{}}
height  number  no  -
image   string  yes -

"SampleComponent" ComponentNo propTypes defined!

Meskipun saya menentukan opsi untuk propTables dengan { propTables: [SampleComponent], inline: true } , saya mendapatkan kedua versi yang dirender. Adakah cara untuk menonaktifkan propTable untuk komponen yang dirender? Sepertinya itulah yang terjadi: komponen yang dirender propTypes juga digunakan, oleh karena itu undefined karena diekspor setelah beberapa fungsi urutan yang lebih tinggi dibungkus.

Mungkin, ada cara yang lebih baik untuk mencapai apa yang saya butuhkan sama sekali...

Terima kasih atas saranmu.

info bug has workaround

Sumber

shilman

👍3

Komentar yang paling membantu

Komentar oleh carlosrberto
_Kamis 26 Jan 2017 pukul 17:08 GMT_

Saya pikir propTables harus menggantikan propTables default

shilman pada 22 Apr 2017

👍3

Semua 3 komentar

Komentar oleh carlosrberto
_Kamis 26 Jan 2017 pukul 17:08 GMT_

Saya pikir propTables harus menggantikan propTables default

shilman pada 22 Apr 2017

👍3

Komentar oleh FarhadG
_Senin 30 Januari 2017 pukul 17:41 GMT_

Pendekatan yang menurut saya cukup berguna adalah dengan hanya mengekspor komponen "dibungkus" dan "tidak dibungkus" sehingga saya tidak hanya dapat menggunakannya untuk menguji komponen yang dibungkus dengan mudah (dan peningkatan urutan yang lebih tinggi) tetapi juga komponen telanjang tetapi juga kemampuan untuk mendokumentasikan komponen dengan Storybook dengan cukup mudah.

Ini menyelesaikan masalah rendering ganda karena saya menggunakan komponen yang tidak dibungkus untuk bagian dokumentasi itu dan dapat digunakan untuk memanfaatkan fungsi Buku Cerita lainnya.

Saya harap ini bermanfaat bagi orang lain yang mengalami masalah yang sama.

shilman pada 22 Apr 2017

Saya mengomentari masalah asli yang sudah ketinggalan zaman , dan sekarang setelah itu ditutup, saya menemukan masalah terbuka ini, jadi saya akan menyalin komentar saya jika itu berguna untuk orang lain: dalam kasus di mana pembungkus tidak dapat dihindari (misalnya, cerita untuk komponen internal SVG yang memerlukan pembungkus <svg> ), Anda dapat menentukan opsi propTablesExclude untuk membuat daftar hitam (semua) komponen yang Anda tidak ingin tabel prop dirender untuk.