React：如何添加唯一的类名？

Question

How to add to className - "i" ? To make each class unique? Or maybe it is done somehow differently? Tell me please?

 const onHandleCreateBlockInfo = () => { return infoArray.map(i => { return ( <div key={id++} className={i.keys()}> {i.company !== undefined ? <h2>Всего клиентов: {i.company.length}</h2> : null} {i.invoice !== undefined ? <h2>Оплаченных заказов: {i.invoice.length}</h2> : null} {i.projects !== undefined ? <h2>Открытых проектов: {i.projects.filter(i => i.status === true).length}</h2> : null} {i.users !== undefined ? <h2>Работников компании: {i.users.length}</h2> : null} </div> ); }) };

This is not how it works (

Answer 1

try className={"myClassName"+index} which is static part myClassName and adding the index to it; be sure to get the index inside map also. Snippet below:

  return infoArray.map((i, index) => {
return (
  <div key={index} className={"myClassName"+index}>
 {i.company !== undefined ? <h2>Всего клиентов: {i.company.length}</h2> : null}
 {i.invoice !== undefined ? <h2>Оплаченных заказов: {i.invoice.length}</h2> : null}
 {i.projects !== undefined ? <h2>Открытых проектов: {i.projects.filter(i => i.status === true).length}</h2> : null}
 {i.users !== undefined ? <h2>Работников компании: {i.users.length}</h2> : null}
  </div>
);
  })