Я новичок в React и задаюсь вопросом, как изменить этот код, чтобы я не использовал любой для функции добавления , которая вводилась в компонент.
Большая часть того, что я прочитал, говорит об использовании типа события React click мыши, но он имеет только 1 параметр и на самом деле не то, что происходит в любом случае, поэтому кажется плохим два разных способа.
import React, { useState } from 'react';
interface IProps {
count?: number;
incrementBy?: number;
onClick: any;
// EDIT - FIX - correct fn type
// I also took optional ? off types in app
//onClick: (count: number, incrementBy: number) => void;
}
const Description2: React.FC<IProps> = (props: IProps) => (
<div>
<p>My favorite number is {props.count}, incrementBying by {props.incrementBy}</p>
<button
onClick={() => props.onClick(props.count, props.incrementBy)}
>
Increase
</button>
</div>
);
const App: React.FC = () => {
//initialize state
const increase = 4;
const [count, setCount] = useState(increase);
const [user, setUser] = useState("world");
const add = (currentCount: number, bump: number) => {
setCount(currentCount + bump);
};
return (
<div >
<Description2
count={count}
incrementBy={increase}
onClick={add} />
</div>
);
}
export default App;