React-classnames库怎么用？

为什么要用？
我的react工程中使用了css-module，当对同一元素附加多个CSS样式时报错

报错：<div className={style.font style.color}>报错</div>

首先在package.json引入该组件（npm install classnames）

然后在代码中写入

import * as React from "react";
import styles from "./index.css";
import classNames from "classnames";

const ClassNames_example = () => {

  const mixClass = classNames({ font: true, color: true });
  return (
    <div>
      <div className={styles.font}>style_font</div>
      <div className={styles.color}>style_color</div>
      <div className={mixClass}>style_mix</div>
    </div>
  );
};

export default ClassNames_example;

结果

样式需动态变化时

const [state, setState] = React.useState(0);
const mixClass = classNames({ font: state === 0, color: true });