React JS中如何用函数设置className？附代码修正

正确代码 #

<ul className="iqacbar-nav" id="iqacbar-nav">
  <li className="nav-heading">menu</li>
  <li className={`nav-item ${isActive('/')}`}>
    <Link className="nav-link collapsed active" to="/">
      <span> Home</span>
    </Link>
  </li>
  <li className="nav-heading">aboutus</li>
  <li className="nav-heading">contactus</li>
  <li className="nav-heading">admissions</li>
  <li className="nav-heading">courses</li>
  <li className="nav-heading">blogs</li>
  <li className="nav-heading">reviews</li>
</ul>

错误修正细节 #

• 原<li>标签的className写法错误：在JSX中同时设置静态类名和动态返回值时，必须使用ES6模板字符串（反引号包裹），才能将静态的nav-item与isActive('/')返回的动态类名正确拼接。
• 原<Link>标签的to属性缺少闭合引号：已补充完整为to="/"，符合JSX的属性语法规范。

内容的提问来源于stack exchange，提问作者Prasanna