node之classnames模块

在react中编写模板时给标签添加class。

如果是固定的className="XX"就可以了。

如果要根据状态值动态应用或去除，

或使用多个class时就麻烦了。

可以使用classnames模块来解决：

 
 

  
  var classnames= require('classnames');
 
 
 
 

  
  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' 
   
   
  
  classNames
  
  (
  
  'foo'
  
  ,
  
   
  
  {
  
   bar
  
  :
  
   
  
  true
  
  ,
  
   duck
  
  :
  
   
  
  false
  
   
  
  }
  
  ,
  
   
  
  'baz'
  
  ,
  
   
  
  {
  
   quux
  
  :
  
   
  
  true
  
   
  
  }
  
  )
  
  ;
  
   
  
  // => 'foo bar baz quux' 
  
  

 
 
 
 

  
  classNames(null, false, 'bar', undefined, 0, 1, { baz: null }, ''); // => 'bar 1' 

 
 
 
 

  
  classNames('a',['b',{c:true}]) 
 
 
 
 

  
  

 
 
 
 

  
  它有多种使用，参数要以是多个，可以是字符串，也可以是对象,还可以是数组。组成使用也可以
 
 
 
 

  
  ，通过值的true false来判断是否应用 
 
 
 
 

  
  

 
 

<div className={classnames('h1 h2')} >

className={classnames({'a':true,'b':false})}

在react中需这样使用