CODEWITHSUNDEEP
javascriptreactjsjsx
Jildo
Jildo

Reputation: 21

onClick add propertie to jsx

sample thing but I'm stuck.

I want onClick add the propertie color="primary" to the element I tried with onClick but I missed somthing it didn't works someone have an exemple maybe ?

    export default function TestButton() {
  const classes = useStyles();
 // const { room } = useVideoContext();

  return (
    <Tooltip title={'Test'} >
      <Fab className={classes.fab} > //Here !
        <RecordVoiceOverSharpIcon />
      </Fab>
    </Tooltip>
  );
 }

Upvotes: 0

Views: 38

Answers (2)

Zahid Hasan
Zahid Hasan

Reputation: 622

You can put onclick either in Tooltip or Fab component. Try it out. Hope it will work.

export default function SimpleTooltips() {
  const classes = useStyles();
  const [color, setColor] = React.useState('primary')
  return (
    <div>
      <Tooltip title="Add" aria-label="add">
        <Fab color={color} className={classes.fab} onClick={() => setColor('secondary')}>
          <AddIcon />
        </Fab>
      </Tooltip>
    </div>
  );
}

Upvotes: 1

Gimnath
Gimnath

Reputation: 1078

You can use onClick function.

export default function TestButton() {
  const classes = useStyles();

  return (
    <Tooltip title={'Test'} >
      <Fab className={classes.fab} onClick={()=>{
         console.log('Clicked....')}}> //Here !
        <RecordVoiceOverSharpIcon />
      </Fab>
    </Tooltip>
  );
 }

Upvotes: 1

Related Questions