我有一個javascript文件,可以在其中簡單地定義css類,以便可以在我的代碼中使用它們并可以將它們維護在一個位置,如下所示://css.jsconst pre = 'grc-';const backdropcss = { backdrop: `${pre}backdrop`,};const buttoncss = { btn: `${pre}btn`, btnSm: `${pre}btn--sm`, btnSecondary: `${pre}btn--secondary`, btnTertiary: `${pre}btn--tertiary`, btnLink: `${pre}btn--link`, btnFull: `${pre}btn--full`, btnHalf: `${pre}btn--half`, btnThird: `${pre}btn--third`,};//etc.我以兩種方式使用它。對于我的組件庫,我想像這樣隔離組件的css名稱:export { buttoncss, alertcss, checkboxcss, formcss, radioboxcss, drawercss, backdropcss, rangecss,};因此,我只能導(dǎo)入所需的內(nèi)容。但是我還希望將所有定義組合在一起的默認導(dǎo)出。(注:所以我不希望用它們作為cssjs.buttoncss,而是因為cssjs它具有所有子對象擴散到)為了創(chuàng)建對象,我將所有子對象展開,然后將其導(dǎo)出為默認對象,如下所示:const cssjs = { ...buttoncss, ...alertcss, ...checkboxcss, ...formcss, ...radioboxcss, ...drawercss, ...backdropcss, ...rangecss,};export default cssjs;現(xiàn)在,每次創(chuàng)建新組件時,在這些對象中添加兩次都是多余的。所以我想創(chuàng)建一個all對象:const all = { buttoncss, alertcss, checkboxcss, formcss, radioboxcss, drawercss, backdropcss, rangecss,};并將它們傳播到(命名的)出口中:export { ...all}然后,我將編寫一些代碼來遍歷all對象,并將每個子對象散布到一個大對象中(cssjs從之前創(chuàng)建對象)。但是在我能夠編寫最后的代碼之前,我注意到export { ...all}不支持該語法。有什么方法可以完成我想要的工作,還是我必須像現(xiàn)在這樣兩次寫所有東西?編輯:如果在聲明時將變量設(shè)置為exports,請重新使用變量,這使我措手不及。現(xiàn)在這是我的代碼://more definitionsexport const formcss = { formGroup: `${pre}form--group`,};export const radioboxcss = { radio: `${pre}radio`, radioStacked: `${pre}radio--stacked`,};export default { ...buttoncss, ...alertcss, ...checkboxcss, ...formcss, ...radioboxcss, ...drawercss, ...backdropcss, ...rangecss,};這解決了我的特定問題,但仍然讓我感到奇怪,為什么不可能將對象擴展到導(dǎo)出聲明中,以便您可以按對象內(nèi)的名稱導(dǎo)出對象中的所有內(nèi)容。因此,對于可能通過標題來到這里的其他人:我為什么要這樣做const one = 1const two = 2export { one, two, }但這不是const one = 1const two = 2 const numbers = { one, two, }export { ...numbers, }
查看完整描述