A
A
Anastasia2020-12-18 15:57:36
JavaScript
Anastasia, 2020-12-18 15:57:36

How to change the style on click of the entire content of the container?

Now, on click, the style changes - transparency - only for the event object, well, that's what I wrote in the function. How to change the function so that the style changes for the entire container at once - both for the icon and for the text - no matter which of the elements is the event object?

<div className="chart-legend">
          {chart?.map((item, i) => {
            const itemclickHandler = e => {
              item.setVisible(!item.visible);
              switch (e.target.style.opacity) {
                case '':
                  return (e.target.style.opacity = '0.3');
                case '0.3':
                  return (e.target.style.opacity = '1');
                case '1':
                  return (e.target.style.opacity = '0.3');
                default:
                  break;
              }
            };
            return (
              <div className="chart-legend-item" onClick={itemclickHandler}>
                <div className="chart-legend-item__icon">{chartIcons[i]}</div>
                <div className="chart-legend-item__text">{item.name}</div>
              </div>
            );
          })}
        </div>

Answer the question

In order to leave comments, you need to log in

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question