Как сделать что бы применялись обновленные данные после нажатия на кнопку?

Question

[Ogurchik-007]

Как сделать так что бы после нажатия на кнопку обновлялись данные Style ?

import classes from './Slider.module.scss';
import slide from '../../assets/images/slider_img.jpg';
import slideV from '../../assets/images/ikon.jpg';
import leftArrow from '../../assets/images/left-arrow.png';
import rightArrow from '../../assets/images/right-arrow.png';

const Slider = (): JSX.Element => {

  let LX: number = 100;

  const leftSwitch = () => {
    LX += 100;
    console.log(LX)
  }

  const rightSwitch = () => {
    console.log('Правая')
  }

  return (
        
    <div className={classes.slider}>

			<div className={classes.sliderLine} style={{left:LX}}>

				<div className={classes.sliderItem}>	<img src={slide} alt="слайд" />	</div>
				<div className={classes.sliderItem}>	<img src={slideV} alt="слайд" />	</div>

			</div>

      <img src={leftArrow} alt='' className={classes.prevArrow} onClick={leftSwitch}/>
	  	<img src={rightArrow} alt='' className={classes.nextArrow} onClick={rightSwitch}/>
      
      </div>
     
   );
  }

export default Slider;

Answer 1

[Alexandroppolus]

let [LX, setLX] = useState(100);

const leftSwitch = () => {
    setLX(lx => lx + 100);
}