why multiple classNames given in reactjs are not applying code example

Example 1: add 2 class names react

<input className={`form-control round-lg ${this.state.valid ? '' : 'error'}`} />

Example 2: How to add multiple classes to a ReactJS Component

var liClasses = classNames({
      'main-class': true,
      'activeClass': self.state.focused === index
    });

    return (<li className={liClasses}>{data.name}</li>);