1

我正在构建一个 react/redux 应用程序并在前端使用一个名为 Grommet 的 ux 库。我设置了应用程序，以便在页面上的一组手风琴中包含一系列表单。这是一个仅包含一个手风琴标签的精简版本：

handleCpuChange(event) {
    console.log(event.target)
    this.props.updateStore(
        {'general': {'cpus': event.target.value} }
    )
}

<Accordion>
    <AccordionPanel heading="General">
        <Box>
            <FormFields>
                <FormField label='CPUs'>
                    <NumberInput
                        value={this.props.form.formData.general.cpus}
                        onChange={this.handleCpuChange.bind(this)}/>
                </FormField>
                <FormField label='Ram'>
                     <NumberInput
                         defaultValue={this.props.form.formData.general.ram}
                         onChange={this.handleCpuChange.bind(this)}/>
                 </FormField>
             </FormFields>
         </Box>
    </AccordionPanel>
</Accordion>

- 所有这些工作正常。问题是，当我调用 handleCpuChange 函数时，我的状态/存储值会更新 - 但我的实际“值”或“默认值”字段保持不变。在大多数情况下，这没有问题，但如果我关闭并重新打开手风琴，这些字段中的值将重置为通过 props 提供的默认值/值。我认为解决这个问题的一个好方法是在手风琴打开或关闭时将状态重新映射到道具，以更新实际值 - 但我不确定如何在不重新加载整个页面的情况下执行此操作。

4

0 回答 0