反応コンポーネントでは、css モジュールを使用しており、正常に動作しているこの条件付き css を取得しましたが、classnames ライブラリを使用してリファクタリングしたいと考えています。
className = { `${active ? styles.activeLabel : styles.notActiveLabel}
${weight === 'bold' ? styles.bold : ''}`}
だから私はこれを試しましたが、アクティブが常にfalseを返すというエラーメッセージが表示されます。
className={classnames({styles.activeLabel: !!active}, {styles.bold: weight === 'bold'})}
styles.activeLabel: active === true も試しましたが、別のエラー メッセージが表示されます。基本的に、アクティブな小道具がtrueの場合はactiveLabelクラスを適用し、アクティブがfalseの場合はnotActiveLabelクラスを適用します。クラス名を使用してこれを達成するにはどうすればよいですか?