The ES6 extension operator cannot be used after a question mark expression.

using css moudules, I encountered the problem of requiring multiple css classes
as follows

 <div className={this.state.showall?...[style.TopBannerBox,style.actAll]:style.TopBannerBox}>

can"t you use it this way? This makes the report wrong.

the following

was used earlier
style.TopBannerBox + " " + style.actAll

this approach is not good for the neatness of the code and looks uncomfortable.

figured it out, you can"t use the extension operator. The extension operator compiles style.TopBannerBox,style.actAll, so it will report an error, but when console.log () comes out, it will automatically separate", "into multiple values, which looks like style.TopBannerBox style.actAll. If you are not good at learning, you will not be good at learning!

Mar.15,2021

you can try to write:

className={showall ? [styles.TopBannerBox, styles.actAll].join(' ') : styles.TopBannerBox}

but in css modules', this is not recommended. It recommends that there is only one 'className', per element without superposition. In this case, you can add a class, such as' actBox', and then merge the above two classes:
css-modules composition

// styles.css
.actBox{
 composes : TopBannerBox actAll;
}
className={showall ? styles.actBox : styles.TopBannerBox}

how about this

<div className={this.state.showall?(...[style.TopBannerBox,style.actAll]):style.TopBannerBox}>

A change of ideas can be put in front of
< div className= {.this.state.showall? [style.TopBannerBox,style.actAll]: [style.TopBannerBox]} >

MySQL Query : SELECT * FROM `codeshelper`.`v9_news` WHERE status=99 AND catid='6' ORDER BY rand() LIMIT 5
MySQL Error : Disk full (/tmp/#sql-temptable-64f5-1be5655-30ef9.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
MySQL Errno : 1021
Message : Disk full (/tmp/#sql-temptable-64f5-1be5655-30ef9.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
Need Help?