Hai Guys... Ini kode kalkulator sederhana dengan react js
import React, { useState } from 'react';
const Calculator = () => {
const [display, setDisplay] = useState('');
const handleButtonClick = (value) => {
if (value === '=') {
try {
setDisplay(eval(display).toString());
} catch (error) {
setDisplay('Error');
}
} else if (value === 'C') {
setDisplay('');
} else {
setDisplay(display + value);
}
};
return (
<div className="calculator">
<input type="text" value={display} disabled />
<div className="buttons">
<button onClick={() => handleButtonClick('7')}>7</button>
<button onClick={() => handleButtonClick('8')}>8</button>
<button onClick={() => handleButtonClick('9')}>9</button>
<button onClick={() => handleButtonClick('/')}>/</button>
<button onClick={() => handleButtonClick('4')}>4</button>
<button onClick={() => handleButtonClick('5')}>5</button>
<button onClick={() => handleButtonClick('6')}>6</button>
<button onClick={() => handleButtonClick('*')}>*</button>
<button onClick={() => handleButtonClick('1')}>1</button>
<button onClick={() => handleButtonClick('2')}>2</button>
<button onClick={() => handleButtonClick('3')}>3</button>
<button onClick={() => handleButtonClick('-')}>-</button>
<button onClick={() => handleButtonClick('0')}>0</button>
<button onClick={() => handleButtonClick('.')}>.</button>
<button onClick={() => handleButtonClick('=')}>=</button>
<button onClick={() => handleButtonClick('+')}>+</button>
<button onClick={() => handleButtonClick('C')}>C</button>
</div>
</div>
);
};
export default Calculator;
Komentar
Posting Komentar