How to access the nested object in react js

Question

I have handle click and I want to access the className of the div element, how can I do that

this is the element i want to get the div className

 <div className="milad">
     <IconButton
        style={{outline:'none', color: 'white', float:'right', marginRight:'20px', marginTop: "5px"}}
                className = "iconButton"
     >menu
        <MenuIcon/>
     </IconButton>
 </div>

this is my

checkHandleClick = (event) => {
    console.log(event);
}
-----------------------------------------------------------------
<ClickAwayListener onClickAway={((e) => this.checkHandleClick(e))}>
-----some code------
</ClickAwayListener>

I want to access this Console.log

Manish D. · Accepted Answer · 2020-09-28 08:37:33Z

1

You could do using event.target.className

checkHandleClick = (event) => {
    console.log(event.target.className);
}
-----------------------------------------------------------------
<ClickAwayListener onClickAway={((e) => this.checkHandleClick(e))}>
-----some code------
</ClickAwayListener>

answered Sep 28, 2020 at 8:37

Manish D.

913 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Oro · Accepted Answer · 2020-09-28 08:33:26Z

0

You should use ref for it.

class MyComponent extends React.Component {
  constructor(props) {
    super(props);
    this.myRef = React.createRef();
  }
  render() {
    return <div ref={this.myRef} />;
  }
}

Or if you're using hooks

function TextInputWithFocusButton() {
  const inputEl = useRef(null);
  const onButtonClick = () => {
    // `current` points to the mounted text input element
    inputEl.current.focus();
  };
  return (
    <>
      <input ref={inputEl} type="text" />
      <button onClick={onButtonClick}>Focus the input</button>
    </>
  );
}

answered Sep 28, 2020 at 8:33

Oro

2,6561 gold badge10 silver badges26 bronze badges

Collectives™ on Stack Overflow

How to access the nested object in react js

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related