classnames是一个npm用来连接多个类名的工具包，可以加入逻辑判断从而生成自己需要的类名。例如：
classNames('foo', 'bar'); // => 'foo bar'
classNames('foo', { bar: true }); // => 'foo bar'
classNames({ 'foo-bar': true }); // => 'foo-bar'
classNames({ 'foo-bar': false }); // => ''
classNames({ foo: true }, { bar: true }); // => 'foo bar'
classNames({ foo: true, bar: true }); // => 'foo bar'
但是这样用通常会比较麻烦，如果用es6的模板字符串，其实也可以完成同样的功能。
`foo bar` // => 'foo bar', not that exciting `foo ${ true ? 'bar': '' }`; // => 'foo bar' `${true ? 'foo-bar': '' }`; // => 'foo-bar' `${ false ? 'foo-bar' : ''}` // => '' `${ true? 'foo': '' } ${ true ? 'bar': '' }`; // => 'foo bar'
对于多个类名还可以通过数组连接：
const componentClassName = [ 'some-base-class', someBooleanCondition && 'a-class-in-here', someOtherBoolean && 'another-class', ] .filter(Boolean) .join(' ')
后面2种写法可以替换掉大部分使用classnames的情况