Another Page
demo.js
let a = 1;
console.log(a);Component
import { useState } from 'react';
import styles from '../../components/counters.module.css'
export const Counter = () => {
const [count, setCount] = useState(0);
return (
<div>
<button onClick={() => setCount(count + 1)} className={styles.counter}>Clicked {count} times</button>
</div>
);
};External Component
import { useState } from 'react';
import styles from './counters.module.css';
function MyButton() {
const [count, setCount] = useState(0)
const handleClick = (action) => {
action === 'increment' ? setCount(count + 1) : count > 0 && setCount(count - 1);
}
return (
<div>
<button onClick={() => handleClick('increment')} className={styles.counter}>
+
</button>
<button onClick={() => handleClick('decrement')} className={styles.counter}>
-
</button>
<div className={styles.count}>{count}</div>
</div>
)
}0