Heim > Fragen und Antworten > Hauptteil
Ich versuche, ein Modal mit einem +/- Zähler zu erstellen.
Ich denke jedoch, dass das Modal ihn nicht erkennt, da sich der Zustand in der zugrunde liegenden Komponente befindet. Irgendeine Idee, wie man das Problem beheben kann?
Ich habe versucht, es als Requisite weiterzugeben, aber ohne Erfolg
export default function ProgramCard() { const [count, setCount] = useState(0); const handleIncrement = () => { console.log(1) setCount(prevCount => prevCount + 1); }; const handleDecrement = () => { setCount(prevCount => prevCount - 1); }; const [opened, { open, close }] = useDisclosure(false); const openModal = () => modals.openConfirmModal({ title: 'Input Data', children: ( <div> <Button placeholder='-' onClick={handleDecrement}></Button>{" # "}{count}{" # "} <Button placeholder='+' onClick={handleIncrement}></Button> </div> ), labels: { confirm: 'Confirm', cancel: 'Cancel' }, onCancel: () => console.log('Cancel'), onConfirm: () => notifications.show({ title: 'Input Submitted', message: 'Complete', }), }); return ( <Grid.Col span={2}> <Paper shadow="xs" radius="md" p="sm"> <Text fw={700}>Sample</Text> <br></br> <Space h="xs" /> <Button variant={'light'} radius="xl" size="xs" onClick={openModal}> Record </Button> </Paper> </Grid.Col> ) }
Ich habe versucht, es als Requisite weiterzugeben, aber ohne Erfolg
P粉4959559862024-04-04 12:55:16
我认为你只需要传递 handleIncrement
:
由于闭包在 javascript 中的工作方式,无论您在哪里调用 handleIncrement
,它仍然会引用 setCount
,而 setCount
又引用 count
在 Modal
组件内部,您可能有一个按钮